123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102 |
- var dom = document.getElementById("box5");
- var myChart = echarts.init(dom);
- var app = {};
- option = null;
- var dataCount = 5e5;
- var data = generateData(dataCount);
- var option = {
- title: {
- textStyle:{//图例文字的样式
- color:'#fff',
- fontSize:12
- },
- text: echarts.format.addCommas(dataCount) + ' Data',
- left: 10
- },
- toolbox: {
- feature: {
- dataZoom: {
- yAxisIndex: false
- },
- saveAsImage: {
- pixelRatio: 2
- }
- }
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- }
- },
- grid: {
- bottom: 90
- },
- dataZoom: [{
- type: 'inside'
- }, {
- type: 'slider'
- }],
- textStyle:{//图例文字的样式
- color:'#fff',
- fontSize:12
- },
- xAxis: {
- data: data.categoryData,
- silent: false,
- splitLine: {
- show: false
- },
- splitArea: {
- show: false
- }
- },
- yAxis: {
- splitArea: {
- show: false
- }
- },
- series: [{
- type: 'bar',
- data: data.valueData,
- // Set `large` for large data amount
- large: true
- }]
- };
- function generateData(count) {
- var baseValue = Math.random() * 1000;
- var time = +new Date(2011, 0, 1);
- var smallBaseValue;
- function next(idx) {
- smallBaseValue = idx % 30 === 0
- ? Math.random() * 700
- : (smallBaseValue + Math.random() * 500 - 250);
- baseValue += Math.random() * 20 - 10;
- return Math.max(
- 0,
- Math.round(baseValue + smallBaseValue) + 3000
- );
- }
- var categoryData = [];
- var valueData = [];
- for (var i = 0; i < count; i++) {
- categoryData.push(echarts.format.formatTime('yyyy-MM-dd\nhh:mm:ss', time));
- valueData.push(next(i).toFixed(2));
- time += 1000;
- }
- return {
- categoryData: categoryData,
- valueData: valueData
- };
- }
- ;
- if (option && typeof option === "object") {
- myChart.setOption(option, true);
- }
|