You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by GitBox <gi...@apache.org> on 2019/05/29 08:53:17 UTC

[GitHub] [incubator-echarts] hduhdc commented on issue #195: ehcarts有没有提供百分比堆积柱状图?

hduhdc commented on issue #195: ehcarts有没有提供百分比堆积柱状图?
URL: https://github.com/apache/incubator-echarts/issues/195#issuecomment-496847233
 
 
   > 没有,现有图表做起来其实也蛮简单的,随便找个example试试这个option,随便写的,可以自己封装一下
   > 
   > var oridata = [
   > [120, 132, 101, 134, 90, 230, 210],
   > [220, 182, 191, 234, 290, 330, 310],
   > [150, 232, 201, 154, 190, 330, 410]
   > ];
   > var data0 = [];
   > var data1 = [];
   > var data2 = [];
   > var total;
   > for (var i = 0, l = oridata[0].length; i < l; i++) {
   > total = oridata[0][i] + oridata[1][i] + oridata[2][i];
   > data0.push(Math.round(oridata[0][i]/total * 100));
   > data1.push(Math.round(oridata[1][i]/total * 100));
   > data2.push(100 - data0[data0.length - 1] - data1[data1.length - 1]);
   > }
   > option = {
   > tooltip : {
   > trigger: 'axis',
   > axisPointer : { // 坐标轴指示器,坐标轴触发有效
   > type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
   > }
   > },
   > legend: {
   > data:['邮件营销','联盟广告','视频广告']
   > },
   > toolbox: {
   > show : true,
   > orient: 'vertical',
   > x: 'right',
   > y: 'center',
   > feature : {
   > mark : true,
   > dataView : {readOnly: false},
   > magicType:['line', 'bar'],
   > restore : true,
   > saveAsImage : true
   > }
   > },
   > calculable : true,
   > xAxis : [
   > {
   > type : 'category',
   > data : ['周一','周二','周三','周四','周五','周六','周日']
   > }
   > ],
   > yAxis : [
   > {
   > type : 'value',
   > splitArea : {show : true}
   > }
   > ],
   > series : [
   > {
   > name:'邮件营销',
   > type:'bar',
   > stack: '广告',
   > data:data0
   > },
   > {
   > name:'联盟广告',
   > type:'bar',
   > stack: '广告',
   > data:data1
   > },
   > {
   > name:'视频广告',
   > type:'bar',
   > stack: '广告',
   > data:data2
   > }
   > ]
   > };
   
   但是有问题的是如果 最后一组数据都是100
   var oridata = [
       [120, 132, 101, 134, 90, 230, 100],
       [220, 182, 191, 234, 290, 330, 100],
       [150, 232, 201, 154, 190, 330, 100]
   ];
   这样就会出现33 33 34 这样的,本应该是相等的。
   还有就是查看数据视图,看到的数据也是计算后的,缺点是不是原始数据。如果还想展示原始数据怎么办?

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to 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