| <!-- | |
| Licensed to the Apache Software Foundation (ASF) under one | |
| or more contributor license agreements. See the NOTICE file | |
| distributed with this work for additional information | |
| regarding copyright ownership. The ASF licenses this file | |
| to you under the Apache License, Version 2.0 (the | |
| "License"); you may not use this file except in compliance | |
| with the License. You may obtain a copy of the License at | |
| http://www.apache.org/licenses/LICENSE-2.0 | |
| Unless required by applicable law or agreed to in writing, | |
| software distributed under the License is distributed on an | |
| "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | |
| KIND, either express or implied. See the License for the | |
| specific language governing permissions and limitations | |
| under the License. | |
| --> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <script src="lib/simpleRequire.js"></script> | |
| <script src="lib/config.js"></script> | |
| <script src="lib/jquery.min.js"></script> | |
| <script src="lib/facePrint.js"></script> | |
| <script src="lib/testHelper.js"></script> | |
| <script src="lib/draggable.js"></script> | |
| <link rel="stylesheet" href="lib/reset.css"> | |
| </head> | |
| <body> | |
| <style> | |
| h1 { | |
| line-height: 60px; | |
| height: 60px; | |
| background: #146402; | |
| text-align: center; | |
| font-weight: bold; | |
| color: #eee; | |
| font-size: 14px; | |
| } | |
| .chart { | |
| height: 300px; | |
| } | |
| </style> | |
| <div class="chart" id="plain"></div> | |
| <h1>No scroll, width 300, right: 10</h1> | |
| <div class="chart" id="plain2"></div> | |
| <h1>No scroll, has '\n' after 'line3', bottom: 20</h1> | |
| <div class="chart" id="plain3"></div> | |
| <h1>No scroll, vertical, has '\n' after 'line3', right 20</h1> | |
| <div class="chart" id="plain-v"></div> | |
| <h1>No scroll, vertical, top 'middle', left: 20, heigth: 150</h1> | |
| <div class="chart" id="plain-v2"></div> | |
| <h1>Scroll</h1> | |
| <div class="chart" id="scroll"></div> | |
| <h1>Scroll auto: try to change window size (width: 80%, right: 30)</h1> | |
| <div class="chart" id="scroll-auto"></div> | |
| <h1>Scroll auto: left: 30, right: 30, bottom: 0, position: 'start'</h1> | |
| <div class="chart" id="scroll-lr"></div> | |
| <h1>Scroll vertically</h1> | |
| <div class="chart" id="scroll-v"></div> | |
| <h1>Scroll vertically, left: 10, top: 'center', position: 'start', height: 50% (Turn the second page and resize it until page button disappear)</h1> | |
| <div class="chart" id="scroll-v2"></div> | |
| <div id="legendHoverLink"></div> | |
| <div id="multi-pie"></div> | |
| <div id="icon-circle"></div> | |
| <div id="only-single-item"></div> | |
| <div id="vary-size"></div> | |
| <div id="index-to-no-name"></div> | |
| <script> | |
| function makeSeries(seriesCount, categoryCount) { | |
| var series = []; | |
| var legendData = []; | |
| var xAxisData = []; | |
| for (var j = 0; j < categoryCount; j++) { | |
| xAxisData.push('category' + j); | |
| } | |
| for (var i = 0; i < seriesCount; i++) { | |
| var data = []; | |
| for (var j = 0; j < categoryCount; j++) { | |
| data.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesName = 'line' + i; | |
| series.push({ | |
| name: seriesName, | |
| type: 'line', | |
| stack: 'all', | |
| symbol: 'circle', | |
| symbolSize: 10, | |
| data: data, | |
| step: 'end' | |
| }); | |
| legendData.push(seriesName); | |
| } | |
| return { | |
| series: series, | |
| legendData: legendData, | |
| xAxisData: xAxisData | |
| } | |
| } | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(5, 3); | |
| var option = { | |
| legend: { | |
| selector: true, | |
| selectorLabel: { | |
| color: 'yellow', | |
| borderColor: 'green', | |
| backgroundColor: 'blue' | |
| }, | |
| emphasis: { | |
| selectorLabel: { | |
| backgroundColor: 'red' | |
| } | |
| }, | |
| data: seriesInfo.legendData, | |
| // backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, | |
| tooltip: { | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.create(echarts, 'plain', { | |
| title: [ | |
| 'No scroll, left not set (should be center)', | |
| 'color: yellow, borderColor: green, backgroundColor: blue, emphasis backgroundColor: red' | |
| ], | |
| option: option | |
| }); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(10, 3); | |
| var option = { | |
| legend: { | |
| right: 10, | |
| width: 300, | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| top: 100, | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'plain2', option); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(10, 3); | |
| seriesInfo.legendData.splice(4, 0, '\n'); | |
| var option = { | |
| legend: { | |
| bottom: 20, | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| bottom: 100 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'plain3', option); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(20, 3); | |
| seriesInfo.legendData.splice(4, 0, '\n'); | |
| var option = { | |
| legend: { | |
| orient: 'vertical', | |
| right: 20, | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| right: 240 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'plain-v', option); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(20, 3); | |
| var option = { | |
| legend: { | |
| orient: 'vertical', | |
| left: 20, | |
| top: 'center', | |
| selector: true, | |
| height: 150, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 280 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'plain-v2', option); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(50, 3); | |
| var option = { | |
| legend: [{ | |
| type: 'scroll', | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }, { | |
| type: 'scroll', | |
| bottom: 0, | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| backgroundColor: 'rgba(0,100,50,0.2)', | |
| pageButtonPosition: 'start' | |
| }], | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 280 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'scroll', option, {draggable: true}); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(5, 3); | |
| var option = { | |
| legend: { | |
| type: 'scroll', | |
| width: '80%', | |
| right: 30, | |
| selector: true, | |
| data: seriesInfo.legendData, | |
| pageIconSize: 50, | |
| pageIconColor: 'red', | |
| pageIconInactiveColor: 'green', | |
| backgroundColor: 'rgba(0,100,50,0.2)', | |
| pageTextStyle: { | |
| color: 'yellow', | |
| fontSize: 22 | |
| } | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 280 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'scroll-auto', option, {draggable: true, width: 400}); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(55, 3); | |
| var option = { | |
| legend: { | |
| type: 'scroll', | |
| bottom: 0, | |
| right: 30, | |
| left: 30, | |
| data: seriesInfo.legendData, | |
| selector: true, | |
| pageIconSize: 5, | |
| pageIconColor: 'red', | |
| pageIconInactiveColor: 'green', | |
| backgroundColor: 'rgba(0,100,50,0.2)', | |
| pageButtonPosition: 'start', | |
| pageButtonGap: 20, | |
| pageTextStyle: { | |
| fontSize: 9 | |
| } | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 280 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'scroll-lr', option, {draggable: true, width: 400}); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(55, 3); | |
| var option = { | |
| legend: { | |
| type: 'scroll', | |
| orient: 'vertical', | |
| selector: true, | |
| bottom: 0, | |
| right: 30, | |
| data: seriesInfo.legendData | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| right: 180 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'scroll-v', option, {draggable: true, width: 400}); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts' | |
| ], function (echarts) { | |
| var xAxisData = []; | |
| var data1 = []; | |
| var data2 = []; | |
| var data3 = []; | |
| for (var i = 0; i < 100; i++) { | |
| xAxisData.push('类目' + i); | |
| if (i < 5 && i > 1) { | |
| data1.push(0); | |
| } | |
| else { | |
| data1.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| data2.push(+(Math.random() + 0.5).toFixed(3)); | |
| data3.push(+(Math.random() + 0.5).toFixed(3)); | |
| } | |
| var seriesInfo = makeSeries(5, 3); | |
| var option = { | |
| legend: { | |
| type: 'scroll', | |
| orient: 'vertical', | |
| selector: true, | |
| top: 'middle', | |
| left: 10, | |
| height: '50%', | |
| borderColor: '#819356', | |
| borderWidth: 2, | |
| borderRadius: 4, | |
| data: seriesInfo.legendData, | |
| pageButtonPosition: 'start' | |
| }, | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 180 | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| splitArea: { | |
| show: true | |
| } | |
| }, | |
| series: seriesInfo.series | |
| }; | |
| testHelper.createChart(echarts, 'scroll-v2', option, {draggable: true, width: 400}); | |
| }) | |
| </script> | |
| <script> | |
| var chart; | |
| var myChart; | |
| var option; | |
| require([ | |
| 'echarts'/*, 'map/js/china' */ | |
| ], function (echarts) { | |
| var option = { | |
| tooltip: { | |
| }, | |
| legend: { | |
| data: ['AAA'] | |
| }, | |
| xAxis: { | |
| data: ['A', 'B', 'C'] | |
| }, | |
| yAxis: { | |
| }, | |
| grid: { | |
| right: '50%' | |
| }, | |
| series: [ | |
| { | |
| name: 'AAA', | |
| type: 'bar', | |
| data: [12, 33, 11] | |
| }, | |
| { | |
| name: 'AAA', | |
| type: 'pie', | |
| legendHoverLink: false, | |
| center: ['75%', '50%'], | |
| label: { | |
| show: false, | |
| }, | |
| emphasis: { | |
| label: { | |
| show: true | |
| } | |
| }, | |
| data: [ | |
| { value: 0, name: 'A' }, | |
| { value: 367, name: 'B' }, | |
| { value: 20, name: 'C' } | |
| ] | |
| } | |
| ] | |
| } | |
| chart = myChart = testHelper.create(echarts, 'legendHoverLink', { | |
| title: 'legendHoverLink is disabled on pie', | |
| option: option | |
| }); | |
| }); | |
| </script> | |
| <script> | |
| var chart; | |
| var myChart; | |
| var option; | |
| require([ | |
| 'echarts'/*, 'map/js/china' */ | |
| ], function (echarts) { | |
| var option = { | |
| tooltip: { | |
| }, | |
| legend: { | |
| data: ['a', 'b', 'c'], | |
| selector: true | |
| }, | |
| series: [ | |
| { | |
| name: 'AAA', | |
| type: 'pie', | |
| center: ['75%', '50%'], | |
| radius: '30%', | |
| data: [ | |
| {name: 'a', value: 12}, | |
| {name: 'b', value: 34}, | |
| {name: 'c', value: 56} | |
| ] | |
| }, | |
| { | |
| name: 'BBB', | |
| type: 'pie', | |
| center: ['25%', '50%'], | |
| radius: '30%', | |
| data: [ | |
| {name: 'a', value: 12}, | |
| {name: 'b', value: 34}, | |
| {name: 'c', value: 56} | |
| ] | |
| } | |
| ] | |
| } | |
| chart = myChart = testHelper.create(echarts, 'multi-pie', { | |
| title: 'Hover legend, the segments of BOTH pie should be hightlighted', | |
| option: option | |
| }); | |
| }); | |
| </script> | |
| <script> | |
| var chart; | |
| var myChart; | |
| var option; | |
| require([ | |
| 'echarts'/*, 'map/js/china' */ | |
| ], function (echarts) { | |
| var data = []; | |
| for (var i = 0; i < 30; i++) { | |
| data.push({name: i + '', value: Math.random()}); | |
| } | |
| var option = { | |
| tooltip: { | |
| }, | |
| legend: { | |
| type: 'scroll', | |
| selector: true, | |
| top: 10, | |
| left: 0, | |
| data: echarts.util.map(data, function (item) { | |
| return { | |
| name: item.name, | |
| icon: 'circle' | |
| }; | |
| }) | |
| }, | |
| series: [{ | |
| type: 'pie', | |
| data: data | |
| }] | |
| }; | |
| testHelper.create(echarts, 'icon-circle', { | |
| title: 'The first icon should not be overflow', | |
| option: option | |
| }); | |
| }); | |
| </script> | |
| <script> | |
| var chart; | |
| var myChart; | |
| var option; | |
| require([ | |
| 'echarts'/*, 'map/js/china' */ | |
| ], function (echarts) { | |
| var data = []; | |
| for (var i = 0; i < 6; i++) { | |
| data.push({name: i + '哈哈哈嘿嘿嘿', value: Math.random()}); | |
| } | |
| var option = { | |
| tooltip: { | |
| }, | |
| legend: { | |
| type: 'scroll', | |
| top: 10, | |
| left: 50, | |
| width: 105, | |
| data: echarts.util.map(data, function (item) { | |
| return { | |
| name: item.name, | |
| icon: 'circle' | |
| }; | |
| }) | |
| }, | |
| series: [{ | |
| type: 'pie', | |
| radius: 20, | |
| label: {show: false}, | |
| labelLine: {show: false}, | |
| data: data | |
| }] | |
| }; | |
| testHelper.create(echarts, 'only-single-item', { | |
| title: 'Page up/down should be normal when only single item displayed', | |
| option: option, | |
| draggable: true | |
| }); | |
| }); | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts', | |
| ], function (echarts) { | |
| var data = []; | |
| for (var i = 0; i < 26; i++) { | |
| var name = ''; | |
| var nameNumber = Math.floor(Math.random() * 10); | |
| for (var j = 0; j < nameNumber; j++) { | |
| name += j; | |
| } | |
| data.push({ | |
| name: name, | |
| value: Math.random() | |
| }); | |
| } | |
| var option = { | |
| legend: [{ | |
| type: 'scroll', | |
| selector: true, | |
| itemGap: 30, | |
| backgroundColor: 'rgba(0,100,50,0.2)' | |
| }], | |
| tooltip: { | |
| }, | |
| grid: { | |
| left: 280 | |
| }, | |
| series: { | |
| type: 'pie', | |
| label: {show: false}, | |
| labelLine: {show: false}, | |
| radius: 30, | |
| data: data | |
| } | |
| }; | |
| testHelper.create(echarts, 'vary-size', { | |
| option: option, | |
| draggable: true | |
| }); | |
| }) | |
| </script> | |
| <script> | |
| require([ | |
| 'echarts', | |
| ], function (echarts) { | |
| var seriesInfo = makeSeries(50, 3); | |
| var series = seriesInfo.series.slice(); | |
| series.shift(); | |
| var option = { | |
| legend: [{ | |
| type: 'scroll', | |
| selector: true, | |
| data: seriesInfo.legendData | |
| }], | |
| tooltip: { | |
| }, | |
| xAxis: { | |
| data: seriesInfo.xAxisData | |
| }, | |
| yAxis: { | |
| }, | |
| series: series | |
| }; | |
| testHelper.create(echarts, 'index-to-no-name', { | |
| option: option, | |
| title: [ | |
| 'Pager should be OK when legend 0 (legendData index 0) is not be displayed.', | |
| 'should be at **page 1** at the beginning' | |
| ], | |
| draggable: true | |
| }); | |
| }) | |
| </script> | |
| </body> | |
| </html> |