option = { title: { text: '动态数据', subtext: '纯属虚构' }, tooltip: { trigger: 'axis' }, legend: { // data:['最新成交价', '预购队列'] data:['最新成交价'] }, toolbox: { show: true, feature: { dataView: {readOnly: false}, restore: {}, saveAsImage: {} } }, dataZoom: { show: false, start: 0, end: 100 }, xAxis: [ { type: 'category', // boundaryGap: false,//此为面积图设置 data: (function (){ var now = new Date(); var res = []; var len = 10; while (len--) { res.unshift(now.toLocaleTimeString().replace(/^/D*/,'')); now = new Date(now - 2000); } return res; })() }, // { // type: 'category', // boundaryGap: true, // data: (function (){ // var res = []; // var len = 10; // while (len--) { // res.push(len + 1); // } // return res; // })() // } ], yAxis: [ { type: 'value', scale: true, name: '价格', max: 30, min: 0, boundaryGap: [0.2, 0.2] }, // { // type: 'value', // scale: true, // name: '预购量', // max: 1200, // min: 0, // boundaryGap: [0.2, 0.2] // } ], series: [ { name:'最新成交价', type:'line', // areaStyle: {normal: {}},//此为面积图设置 data:(function (){ var res = []; var len = 0; while (len < 10) { res.push((Math.random()*10 + 5).toFixed(1) - 0); len++; } return res; })(), // 下面的makeLine为设置警告阀值 markLine: { silent: true, data: [{ yAxis: 20 }] } }, // { // name:'预购队列', // type:'bar', // // type: 'line', // xAxisIndex: 1, // yAxisIndex: 1, // data:(function (){ // var res = []; // var len = 10; // while (len--) { // res.push(Math.round(Math.random() * 1000)); // } // return res; // })() // } ]};// app.count = 11;setInterval(function (){ axisData = (new Date()).toLocaleTimeString().replace(/^/D*/,''); var data0 = option.series[0].data; data0.shift(); data0.push((Math.random() * 10 + 5).toFixed(1) - 0); // var data1 = option.series[1].data; // data1.shift(); // data1.push(Math.round(Math.random() * 1000)); option.xAxis[0].data.shift(); option.xAxis[0].data.push(axisData); // option.xAxis[1].data.shift(); // option.xAxis[1].data.push(app.count++); myChart.setOption(option);}, 2000);
新闻热点
疑难解答