实现如图Echarts渐变折线图的方式,提供两种解决方案:
1.series组件属性:
{ type: 'line', name: "总收入", lineStyle: { normal: { width: 3 }, }, itemStyle: { "color": { "type": "linear", "x": 0, "y": 0, "x2": 0, "y2": 1, "colorStops": [ { "offset": 0, "color": "#2c86e1" }, { "offset": 0.5, "color": "#d4f170" }, { "offset": 1, "color": "#ff943c" } ], "globalCoord": false } }, smooth: true, }
2.视觉映射组件:
visualMap: { min: 0, max: 300, left: 'left', top: 'bottom', color: ["#2c86e1","#d4f170","#ff943c"], calculable: true },
必须注意series.data的取值范围在min,max之间。
Done!