Effect:
Code:
initChartsSXJS(){ let myChart = this.$echarts.init(document.getElementById("SXJL_JS")); Tooltip: {trigger: 'item', formatter: {title: {text: '2018 下 载 下 载 ', top:10, left:10}, tooltip: {trigger: 'item', formatter: "{a} <br/>{b} : {c}" }, toolbox: { show : true, top:10, right:10, feature : { mark : {show: true}, magicType : {show: true, type: ['line', 'bar']}, restore : {show: true}, saveAsImage : {show: true} } }, grid:{ top:60, right:70, bottom:30, left:60 }, legend: {top:32, left:'center', data:[' pipeline length ',' number of tube points ']}, calculable: true, xAxis :[{type :' category', data: [' drain 'and' water ', 'gas',' heat ', 'communications',' power ', 'industrial', 'radio', 'other']}], yAxis: [{type: 'value', name:" tuber \n line \n long \n degree \n schematic \n public \n In \ N) ", nameLocation:" Center ", nameGap:35, nameRotate:0, nameTextStyle:{fontSize: 16,}, // The default display is in thousandths, you can add an axisLabel here if you don't want to use it: ShowMinLabel :true, showMaxLabel:true, showMaxLabel:true, formatter: function (value) { return value; } } }, { type: 'value', name:" item \n point \n number \n amount \n item \ N item \ N) ", nameLocation:" Center ", nameGap:50, nameRotate:0, nameTextStyle:{fontSize: n item \n item \n item \ N item \ N), nameLocation:" Center ", nameGap:50, nameRotate:0, nameTextStyle:{fontSize: 16,}, // The default display is in thousandths, you can add an axisLabel here if you don't want to use it: ShowMinLabel :true, showMaxLabel:true, showMaxLabel:true, formatter: Function (value) {return value;}}}], series: [{name:' pipe length ', type:'bar', yAxisIndex: 0, data: [409.07, 187.48, 94.86, 161.11, 327.68, 355.9, 0.56, 49.86, 0.56], / / itemStyle: {normal: {label: {show: True}}}, markPoint: {data: [{type: 'Max ', name:' Max '}, {type: 'min', name: 'minimum'}}}, {name: 'tube point number, type:' bar 'yAxisIndex: 1, data: [18447780, 0284, 3654, 7151, 70265, 69506187, 3542], / / itemStyle: {normal: {label: {show: true}}}, markPoint: {data: [{type: 'Max' name: 'maximum}, {type: "min", name:' minimum '}]}}}; // Display the chart using the configuration items and data you just specified. myChart.setOption(option); },Copy the codeReference;