EChars 图表——并列柱状图

最新推荐文章于 2024-08-27 12:00:00 发布

百奇

最新推荐文章于 2024-08-27 12:00:00 发布

阅读量2.2k

点赞数

分类专栏：图表

本文链接：https://blog.csdn.net/qq_43264596/article/details/91489349

版权

图表专栏收录该内容

7 篇文章 0 订阅

订阅专栏

效果如下：
在这里插入图片描述
实现代码如下：

option = {
    legend: {//标注位置
    orient: 'vertical',
        x: 'right',
        y:'center'
    },
    tooltip: {},//提示线
    dataset: {//数据设置
        source: [
            ['product', '2018Q3', '2018Q4'],
            ['总资产',1573, 1607],
            ['净资产', 324, 354],
            ['核心资产', 338, 348],
        ]
    },
    xAxis: {//X轴的设置
    type: 'category',//不连续的字符串
         axisLine: {// X轴样式设置
                    lineStyle: {
                        type: 'solid',
                        color: '#708090',//线的颜色
                        width:'1'//坐标线的宽度
                    }
                },
    },
    yAxis: {//Y轴的设置
        show:false
    },
    series: [//每个形状的设置
        {type: 'bar',//柱状
        barWidth:'50px',// 每簇之间的距离
        color:'#6495ED',//柱状的颜色
        label: {//提示的设置
                normal: {
                    show: true,
                    position: 'top'
                }
            },
           
        },
        {type: 'bar',
            color:'#CD5C5C',
            barWidth:'50px',
            barGap:'0%',//每簇中的每个柱状的距离 String形式
            label: {
                normal: {
                    show: true,
                    position: 'top'
                }
            },
        }
        
    ]
};