wuye1200 / blog

alber blog
0 stars 0 forks source link

echarts 一些用法 #24

Open wuye1200 opened 5 years ago

wuye1200 commented 5 years ago

嵌套图层

// 主要通过复制x轴数据来辅助y轴
option = {
    tooltip: {
                trigger: 'axis',
                show:true,
                formatter: function(params) { //设置滑过显示小圆点以及对应数据的位置 方便看数
                    var result = params[0].name+'<br>';
                    params.forEach(function(item) {
                          result += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' + item.color + '"></span>';
                          result +=item.seriesName+": "+'<span style="color:#fff">'+ item.data+"</span><br>"
                    });

                        return result;
                },
            },
    xAxis: [{
        type: 'category',
        data:[1,2,3]
    },
     {
        type: 'category',
        data:[1,2,3]
    },
     {
        type: 'category',
        data:[1,2,3]
    }],
    yAxis:{
        type: 'value'
    },
    series: [{
         name: 'A',
                type: 'bar',
                barGap: '0',
                barWidth: '50%',
                itemStyle: {normal: {color: '#ff735c', label: {show: false, textStyle: {color: '#fff'}}}},
                data: [12,12,0]
    },
    {
       name: 'B',
                type: 'bar',
                barGap: '0',
                barWidth: '25%',
                xAxisIndex: 2,
                itemStyle: {
                    normal: {
                        color: '#84c66e',
                        label: {show: false, textStyle: {color: '#27727B'}}
                    }
                },
                data:  [4,5,6]

    }]
};