本文主要是介绍使用echart js构建 折线图标,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
1. echart 自定义颜色线条
$.get(ROOT_PATH + '/data/asset/data/aqi-beijing.json', function (data) {myChart.setOption(option = {title: {text: 'Beijing AQI'},tooltip: {trigger: 'axis'},xAxis: {data: data.map(function (item) {return item[0];})},yAxis: {splitLine: {show: false}},toolbox: {left: 'center',feature: {dataZoom: {yAxisIndex: 'none'},restore: {},saveAsImage: {}}},dataZoom: [{startValue: '2014-06-01'}, {type: 'inside'}],visualMap: {top: 10,right: 10,pieces: [{gt: 0,lte: 50,color: '#096'}, {gt: 50,lte: 100,color: '#ffde33'}, {gt: 100,lte: 150,color: '#ff9933'}, {gt: 150,lte: 200,color: '#cc0033'}, {gt: 200,lte: 300,color: '#660099'}, {gt: 300,color: '#7e0023'}],outOfRange: {color: '#999'}},series: {name: 'Beijing AQI',type: 'line',data: data.map(function (item) {return item[1];}),markLine: {silent: true,data: [{yAxis: 50}, {yAxis: 100}, {yAxis: 150}, {yAxis: 200}, {yAxis: 300}]}}});
});
2.盒须图
这篇关于使用echart js构建 折线图标的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!