Incubator-echarts: echarts рд╡рд┐рдХрд▓реНрдк рдирд╛рдо рдШреБрдорд╛рдПрдБ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛

рдХреЛ рдирд┐рд░реНрдорд┐рдд 8 рдЕрдЧре░ 2017  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: apache/incubator-echarts

рдПрдХ-рдкрдВрдХреНрддрд┐ рдХрд╛ рд╕рд╛рд░рд╛рдВрд╢ [рдкреНрд░рд╢реНрди рд╕рдВрдХреНрд╖рд┐рдкреНрдд]

рдореИрдВ xAxis рдкрд░ рд▓реЗрдмрд▓ рдШреБрдорд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рддрд╛рдХрд┐ рд╡реЗ рд╕рднреА рджрд┐рдЦрд╛рдИ рджреЗ рд╕рдХреЗрдВред

рджрд╕реНрддрд╛рд╡реЗрдЬрд╝реАрдХрд░рдг рдХреЛ рджреЗрдЦрддреЗ рд╣реБрдП рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдХрдорд╛рдВрдб рдиреЗрдорд░реЛрдЯреЗрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХрд╛ рдПрдХ рд╡рд┐рдХрд▓реНрдк рд╣реИ рд▓реЗрдХрд┐рди рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИ ..?

рд╕рд┐рдВрдЯреИрдХреНрд╕ рдХреЛ рдСрдирд▓рд╛рдЗрди рдбреЗрдореЛ рдкрд░ рд▓рд╛рдЧреВ рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд┐рдпрд╛ рдФрд░ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рдерд╛ ....

рд╕рдВрд╕реНрдХрд░рдг рдФрд░ рдкрд░реНрдпрд╛рд╡рд░рдг [рд╕рдВрд╕реНрдХрд░рдг рдФрд░ рдкрд░реНрдпрд╛рд╡рд░рдг]

  • ECharts рд╕рдВрд╕реНрдХрд░рдг [ECharts рд╕рдВрд╕реНрдХрд░рдг]: 3.6.2
  • рдмреНрд░рд╛рдЙрдЬрд╝рд░ рд╕рдВрд╕реНрдХрд░рдг [рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдкреНрд░рдХрд╛рд░ рдФрд░ рд╕рдВрд╕реНрдХрд░рдг]: рдХрд┐рдирд╛рд░рд╛, рдХреНрд░реЛрдо
  • рдУрдПрд╕ рд╕рдВрд╕реНрдХрд░рдг [рдСрдкрд░реЗрдЯрд┐рдВрдЧ рд╕рд┐рд╕реНрдЯрдо рдкреНрд░рдХрд╛рд░ рдФрд░ рд╕рдВрд╕реНрдХрд░рдг]: рд╡рд┐рдВрдбреЛрдЬрд╝ 10

рдЕрдкреЗрдХреНрд╖рд┐рдд рд╡реНрдпрд╡рд╣рд╛рд░ [рдЕрдкреЗрдХреНрд╖рд┐рдд рдкрд░рд┐рдгрд╛рдо]

рдЪрд╛рд░реНрдЯ рдХреЗ рдирд┐рдЪрд▓реЗ рднрд╛рдЧ рдореЗрдВ рд▓реЗрдмрд▓ (xAxis) рд▓рдВрдмрд╡рдд рдХреА рдУрд░ рдШреВрдорддреЗ рд╣реБрдП

ECharts рд╡рд┐рдХрд▓реНрдк [ECharts рдХреЙрдиреНрдлрд╝рд┐рдЧрд░реЗрд╢рди рдЖрдЗрдЯрдо]

              var echartBar = echarts.init(document.getElementById('mainb'), theme);

              echartBar.setOption({
                title: {
                 //text: 'Graph title',
                 //subtext: 'Graph Sub-text'
                },
                tooltip: {
                  trigger: 'axis',
                  formatter: "{a} <br/>{b} : {c}%"

                },
                legend: {
                 // data: ['sales', 'purchases']
                },
                toolbox: {
                  show: false
                },
                calculable: true,
                xAxis: {
                  nameRotate: 90, //Rotation of labels - not working!!!!
                  type: 'category',
                  data: ['Client 1', 'Client2', 'Client3', 'Client4', 'Client5', 'Client6', 'Client7', 'Client8', 'Client9?', 'Client10', 'Client11', 'Client12'] //Clients go here
                },
                yAxis: [{
                  type: 'value'
                }],
                series: [{
                  name: 'Overall Progress',
                  type: 'bar',
                  data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
                  markPoint: {
                    data: [{
                      type: 'max',
                      name: 'MAxim',
                                          formatter: "{a} <br/>{b} : {c}%"

                    }, {
                      type: 'min',
                      name: '???'
                    }]
                  },
                  markLine: {
                    data: [{
                      type: 'average',
                      name: 'Average'
                    }]
                  }
option = {

}

рдЕрдиреНрдп рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ [рдЕрдиреНрдп рдЬрд╛рдирдХрд╛рд░реА]

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

xAxis.nameRotate рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреЗрд╡рд▓ xAxis рдирд╛рдо рдХреЗ рд░реЛрдЯреЗрдЯ рдХреЛ рд╕реЗрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ (рдЖрдорддреМрд░ рдкрд░ рдЕрдХреНрд╖ рдХреЗ рдмрд╛рдИрдВ рдпрд╛ рджрд╛рдИрдВ рдУрд░ рдкреНрд░рджрд░реНрд╢рд┐рдд рд╣реЛрддрд╛ рд╣реИ)ред рдЖрдк рд╕рднреА рдЕрдХреНрд╖ рд▓реЗрдмрд▓ рджрд┐рдЦрд╛рдиреЗ рдХреЗ рд▓рд┐рдП xAxis.axisLabel.interval рдпрд╛ xAxis.axisLabel.rotate рд╕реЗрдЯ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рд╕рднреА 3 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

xAxis.nameRotate рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреЗрд╡рд▓ xAxis рдирд╛рдо рдХреЗ рд░реЛрдЯреЗрдЯ рдХреЛ рд╕реЗрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ (рдЖрдорддреМрд░ рдкрд░ рдЕрдХреНрд╖ рдХреЗ рдмрд╛рдИрдВ рдпрд╛ рджрд╛рдИрдВ рдУрд░ рдкреНрд░рджрд░реНрд╢рд┐рдд рд╣реЛрддрд╛ рд╣реИ)ред рдЖрдк рд╕рднреА рдЕрдХреНрд╖ рд▓реЗрдмрд▓ рджрд┐рдЦрд╛рдиреЗ рдХреЗ рд▓рд┐рдП xAxis.axisLabel.interval рдпрд╛ xAxis.axisLabel.rotate рд╕реЗрдЯ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред

рд╕реНрдкрд╖реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЛ рдзрдиреНрдпрд╡рд╛рджред рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдореИрдВ рдЧрд▓рдд рдЬрдЧрд╣ рджреЗрдЦ рд░рд╣рд╛ рдерд╛ред рдЕрдм рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реБрдБред рдмрдврд╝рд┐рдпрд╛ рдкреИрдХреЗрдЬ! рдЕрдЪреНрдЫрд╛ рдХрд╛рдо рдХрд░рддреЗ рд░рд╣реЗрдВред :)

рдХреНрдпрд╛ рдХреЛрдИ рдЬрд╛рдирддрд╛ рд╣реИ рдХрд┐ рдЗрд╕ рддрд░рд╣ рдШреБрдорд╛рд╡рджрд╛рд░ рд░реЗрдЦрд╛ рдХреЗ рдиреАрдЪреЗ рдПрдХ рдФрд░ рдШреБрдорд╛рд╡рджрд╛рд░ рд░реЗрдЦрд╛ рдХреИрд╕реЗ рдкреНрд░рд╛рдкреНрдд рдХрд░реЗрдВ?
grafik

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

kirazxyun picture kirazxyun  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

marine1ly picture marine1ly  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

jarben picture jarben  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

771752687 picture 771752687  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

yj20060714 picture yj20060714  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ