Echarts柱状图禁用高亮踩坑日记

使用series下的itemStyle解决

//鼠标悬停高亮时：
                emphasis: {
          
   
                    color: red,//此方法适用一种柱状图颜色的时候
                }

此处的坑 项目需求一旦一条data 要区分不同颜色时例如:

//data=[100.6, 100.6, 100.57, 100.56, 100.56, 100.56, 778.32, 512.32, 473.32, 394.32, 381.32]
			itemStyle: {
          
   
                    normal: {
          
    //静态的时候显示的默认样式
                        color: params => params.dataIndex > 3 ? pink : red,
                    },
                    emphasis: {
          
   
                        // color: red,
                        //错误写法 emphasis里面 color 不能使用function
                        color: params => params.dataIndex > 3 ? pink : red,                
                    }
                }

var data = [100.6, 100.6, 100.57, 100.56, 100.56, 100.56, 778.32, 512.32, 473.32, 394.32, 381.32];
        data = data.map((item, i) =>
            i > 3 ? item = ({
          
   
                value: item,
                itemStyle: {
          
   
                    normal: {
          
   
                        color: pink
                    },
                    emphasis: {
          
   
                        color: pink
                    }
                }
            }) : item = ({
          
   
                value: item,
                itemStyle: {
          
   
                    normal: {
          
   
                        color: red
                    },
                    emphasis: {
          
   
                        color: red
                    }
                }
            })
        )

自我踩坑 希望和各位小伙伴一起共同进步成长 欢迎交流