[GitHub] hAtul89 opened a new issue #8257: Echarts: Removing "3, 0" when manually placing data using [3, 0]

[GitBox <gi...@apache.org>]

hAtul89 opened a new issue #8257: Echarts: Removing "3,0" when manually placing data using [3,0]
URL: https://github.com/apache/incubator-echarts/issues/8257
 
 
   I am currenlty experimenting with Echarts. 
   
   
   In certain cases, i want to write series-data to my chart in a different category, [as explained in this part of the documentation][1] - using the squared [] to choose the "column" where i want to use the data.  
   
   The problem is that when displaying the data on the chart I get it printed with commas `3,0,0,0`. The parameter responsible for the output is `formatter: '{c}  {name|{a}}'`, and I couldn't find anything else that suits me via [the documentation for the formatter part][2].  
   
   [![enter image description here][3]][3]
   
   This is my code: 
   
       var app = echarts.init(document.getElementById('main-chart'));
       
       var posList = [
           'left', 'right', 'top', 'bottom',
           'inside',
           'insideTop', 'insideLeft', 'insideRight', 'insideBottom',
           'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
       ];
       
       app.configParameters = {
           rotate: {
               min: -90,
               max: 90
           },
           align: {
               options: {
                   left: 'left',
                   center: 'center',
                   right: 'right'
               }
           },
           verticalAlign: {
               options: {
                   top: 'top',
                   middle: 'middle',
                   bottom: 'bottom'
               }
           },
           position: {
               options: echarts.util.reduce(posList, function (map, pos) {
                   map[pos] = pos;
                   return map;
               }, {})
           },
           distance: {
               min: 0,
               max: 100
           }
       };
       
       app.config = {
           rotate: 90,
           align: 'left',
           verticalAlign: 'middle',
           position: 'insideBottom',
           distance: 15,
           onChange: function () {
               var labelOption = {
                   normal: {
                       rotate: app.config.rotate,
                       align: app.config.align,
                       verticalAlign: app.config.verticalAlign,
                       position: app.config.position,
                       distance: app.config.distance
                   }
               };
               app.setOption({
                   series: [{
                       label: labelOption
                   }, {
                       label: labelOption
                   }, {
                       label: labelOption
                   }]
               });
           }
       };
       
       
       
       var labelOption = {
           normal: {
               show: true,
               position: app.config.position,
               distance: app.config.distance,
               align: app.config.align,
               verticalAlign: app.config.verticalAlign,
               rotate: app.config.rotate,
               formatter: '{c}  {name|{a}}',
               // formatter: '{name|{a}}',
               fontSize: 16,
               rich: {
                   name: {
                       textBorderColor: '#fff'
                   }
               }
           }
       };
       
       option = {
           color: ['#007bff', '#00b0f0', 'red', '#e5323e'],
           tooltip: {
               trigger: 'axis',
               axisPointer: {
                   type: 'shadow'
               }
           },
           legend: {
               data: ['Inactives / Viewers', 'Inactives / Viewers / Less than 1min per day', 'Light no Macro'] 
               // data: ['Light no Macro']
       
           },
           toolbox: {
               show: true,
               orient: 'vertical',
               left: 'right',
               top: 'center',
               feature: {
                   mark: {show: true},
                   // dataView: {show: true, readOnly: false},
                   // magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
                   restore: {show: true},
                   saveAsImage: {show: true}
               }
           },
           calculable: true,
           xAxis: [
               {
                   type: 'category',
                   axisTick: {show: false},
                   data: ['usage1', 'usage2', 'usage3', 'sum of all']
               }
           ],
           yAxis: [
               {
                   type: 'value', 
                   name: 'Score'
               }
           ],
           series: [
               {
                   name: 'Light no Macro',
                   type: 'bar',
                   label: labelOption,
                   color: 'red',
                   data: [<?php echo "[3,{$qws[7][7]},0,0]"; ?>]
               },
               {
                   name: 'Inactives / Viewers',
                   type: 'bar',
                   barGap: 0,
                   label: labelOption,
                   data: [<?php echo "{$qws[1][7]},{$qws[3][7]},{$qws[5][7]},{$qws[8][7]}"; ?>] 
               },
               {
                   name: 'Inactives / Viewers / Less than 1min per day',
                   type: 'bar',
                   label: labelOption,
                   data: [<?php echo $qws[2][7].','.$qws[4][7].','.$qws[6][7]; ?>]
               }
           ]
       };
       
           app.setOption(option);
   
   
     [1]: https://ecomfe.github.io/echarts-doc/public/en/option.html#series-bar.data
     [2]: https://ecomfe.github.io/echarts-doc/public/en/option.html#series-bar.label.formatter
     [3]: https://i.stack.imgur.com/ZlD9Y.png

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org