一種方法是使用空字符串填充,類似于[1,2,3,'','','',6,7,8]
另一種方法是使用坐標,如[[0,0],[3,3]]
以下為使用坐標示例
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>echarts
</title><script src="static/js/echarts.js"></script></head><body><div id="main" style="width: 600px;height:400px;"></div><script type="text/javascript">var a = 123; var myChart = echarts.init(document.getElementById('main'));var option = {title: {text: '溫度-降水量示例'},tooltip: {show: true,trigger: 'axis',axisPointer: {type: 'cross',animation: false,label: {show: true,backgroundColor: '#0D4286'}}},toolbox: {show: true,feature: {mark: {show: true},dataZoom: {yAxisIndex: 0},dataView: {show: true,readOnly: false,},magicType: {show: true,type: ['line', 'bar']},restore: {show: true,},saveAsImage: {show: true,}}},legend: {data: ['降水量', '平均溫度1']},dataZoom: [{id: 'dataZoomX',show: true,realtime: true,orient: "horizontal",start: 0,end: 50,dataBackground: {lineStyle: {color: '#95BC2F'},},textStyle: {color: "#ffffff"},},],xAxis: {type: 'category',axisLabel: {rotate: 45,textStyle: {fontSize: '8'}},data: ['2019-01-01','2019-01-02', '2019-01-03','2019-01-04', '2019-01-05', '2019-01-06', '2019-01-07', '2019-01-08']},yAxis: [{type: 'value',name: '水量',min: 0,max: 120,interval: 50,axisLabel: {formatter: '{value}毫升'}}, {type: 'value',name: '溫度',min: 0,max: 27,interval: 5,axisLabel: {formatter: '{value}度'}}],series: [{name: '降水量',type: 'line',yAxisIndex: 0,data: [80, 89, 85, 108, 109, 120]}, {name: '平均溫度1',type: 'line',yAxisIndex: 1,data: [[0,0],[3,1]]}, ]};myChart.setOption(option);</script></body>
</html>
</html>
總結
以上是生活随笔為你收集整理的【echart数组数据】echarts两条或两条以上x轴不同的线合并x轴 含有不连续数据的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。