Echarts常用方法整合

1. 保持高亮 highlight

lastMouseOverIndex=null;
// mouseover事件，记录当前数据索引并取消其他高亮，over在out之后
myChart.on('mouseover', function (params) {
    var dataLen = option.series[0].data.length;
    lastMouseOverIndex = params.dataIndex;
    for(var i=0;i<dataLen;i++){
        if(i!= params.dataIndex){
            myChart.dispatchAction({
                type: 'downplay',
                seriesIndex: 0,
                dataIndex: i
            })
        }
    }
});
// mouseout事件，将上次的高亮
myChart.on('mouseout', function (params) {
    myChart.dispatchAction({
        type: 'highlight',
        seriesIndex: 0,
        dataIndex: lastMouseOverIndex
    })  
});

2. 多个echart自适应

//宽度
   myChart.setOption(option);
   window.addEventListener("resize",function(){
   myChart.resize();
 });
//高度
<div class="mc-echarts-line" style="height: calc(38.4vh) !important"></div>

3.eachart隐藏网格线、x轴，y轴

https://www.cnblogs.com/xiaojun-zxj/p/8327683.html

4.y轴起始坐标设置为数据最小值

yAxis: {
    min: 'dataMin' // 最小值
    scale:true //不从0开始。改为从最小值开始
},

5. echarts折线拐点中心的颜色，不是边框颜色

series: [
    {
        id: 'a',
        type: 'line',
        smooth: true,
        symbol: "circle",      // 默认是空心圆（中间是白色的），改成实心圆
        symbolSize: symbolSize,
        itemStyle: {
            normal: {
                color: "darkgreen",  // 会设置点和线的颜色，所以需要下面定制 line
                borderColor: "blue"  // 点边线的颜色
            }
        },
        lineStyle: {
            normal: {
                color: "#dd3300"   // 线条颜色
            }
        },
        data: data
    }
]

6. echarts-柱状图-柱状阴影

柱状阴影