|  |  | 
 |  |  | <template> | 
 |  |  |   <div id="ConsoleNet" style="width: 100%; height: 100%; background: #FFFFFF; text-align: center"> | 
 |  |  |     <ve-line :data="chartData" :extend="extend" :settings="chartSettings" width="100%" height="100%" ></ve-line> | 
 |  |  |     <ve-line ref="ConsoleNet" :data="chartData" :extend="extend" :settings="chartSettings" width="100%" height="100%" ></ve-line> | 
 |  |  |   </div> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       chartData: { | 
 |  |  |         columns: ['time', 'in', 'out'], | 
 |  |  |         columns: ['time','out','in'], | 
 |  |  |         rows: [] | 
 |  |  |       }, | 
 |  |  |       chartSettings: { | 
 |  |  | 
 |  |  |             showMaxLabel: true, | 
 |  |  |           }, | 
 |  |  |         }, | 
 |  |  |         yAxis: { | 
 |  |  |           type: 'value', | 
 |  |  |           min: 0, | 
 |  |  |           max: 1000, | 
 |  |  |           splitNumber: 6, | 
 |  |  |           position: "left", | 
 |  |  |           silent: true, | 
 |  |  |         }, | 
 |  |  |         tooltip: { | 
 |  |  |           trigger: 'axis', | 
 |  |  |           formatter: (data)=>{ | 
 |  |  |             console.log(parseFloat(data[0].data[1]).toFixed(2)) | 
 |  |  |             console.log(parseFloat(data[1].data[1]).toFixed(2)) | 
 |  |  |             console.log("############") | 
 |  |  |             return "下载:" + parseFloat(data[0].data[1]).toFixed(2) + "Mbps" +  "</br> 上传:" + parseFloat(data[1].data[1]).toFixed(2) + "Mbps"; | 
 |  |  |             return data[1].marker + "下载:" + parseFloat(data[1].data[1]).toFixed(2) + "Mbps" +  "</br> "+ data[0].marker +" 上传:" + parseFloat(data[0].data[1]).toFixed(2) + "Mbps"; | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         legend: { | 
 |  |  | 
 |  |  |     }; | 
 |  |  |   }, | 
 |  |  |   mounted() { | 
 |  |  |     // setInterval(()=>{ | 
 |  |  |     //   // console.log(111111) | 
 |  |  |     //   for (let i = 0; i < this.chartData.rows.length; i++) { | 
 |  |  |     //     this.chartData.rows[i].销售额 += 1000; | 
 |  |  |     //   } | 
 |  |  |     // },1000) | 
 |  |  |     this.$nextTick(_ => { | 
 |  |  |       setTimeout(()=>{ | 
 |  |  |         this.$refs.ConsoleNet.echarts.resize() | 
 |  |  |       }, 100) | 
 |  |  |     }) | 
 |  |  |   }, | 
 |  |  |   destroyed() { | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     setData: function(data) { | 
 |  |  |       console.log(data) | 
 |  |  |     setData: function(data, total) { | 
 |  |  |       this.chartData .rows = data; | 
 |  |  |       this.extend.yAxis.max= total; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |   } |