test/dataZoom-timeAxis.html - echarts - Git at Google

 <!DOCTYPE html>
 <!--
 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="ut/lib/canteen.js"></script> -->
         <link rel="stylesheet" href="lib/reset.css" />
     </head>
     <body>
         <style>
         </style>


         <div id="main0"></div>
         <div id="main1"></div>


         <script>
         require([
             'echarts',
             // 'map/js/china',
             // './data/nutrients.json'
         ], function (echarts) {
             var option;

             const data = [
             [1650508472000,0],[1650508502000,0],[1650508532000,0],[1650508565000,0],
             [1650508596000,0],[1650508606000,0],[1650508626000,0],[1650508656000,0],
             [1650508686000,0],[1650508717000,0],[1650508772000,0],[1650508803000,0],
             [1650508833000,0],[1650508863000,0],[1650508893000,0],[1650508906000,0],
             [1650508923000,0],[1650508953000,0],[1650508985000,0],[1650509019000,0],
             [1650509071000,0],[1650509101000,0],[1650509132000,0],[1650509162000,0],
             [1650509194000,0],[1650509206000,0],[1650509224000,0],[1650509256000,0],
             [1650509286000,0],[1650509318000,0],[1650509373000,0],[1650509403000,0],
             [1650509433000,0],[1650509464000,0],[1650509494000,0],[1650509506000,0],
             [1650509524000,0],[1650509554000,0],[1650509586000,0],[1650509616000,0],
             [1650509672000,0],[1650509702000,0],[1650509734000,0],[1650509763000,0],
             [1650509794000,0],[1650509806000,0],[1650509824000,0],[1650509854000,0],
             [1650509884000,0],[1650509915000,0],[1650509973000,0],[1650510004000,0],
             [1650510034000,0],[1650510064000,0],[1650510095000,0],[1650510106000,0],
             [1650510125000,0],[1650510155000,0],[1650510185000,0],[1650510216000,0],
             [1650510271000,0],[1650510301000,0],[1650510333000,0],[1650510365000,0],
             [1650510395000,0],[1650510407000,0],[1650510425000,0],[1650510456000,0],
             [1650510486000,0],[1650510498000,0],[1650510504000,0],[1650510506000,0],
             [1650510510000,0],[1650510516000,0],[1650510527000,16],[1650510534000,16],
             [1650510540000,16],[1650510542000,16],[1650510546000,16],[1650510551000,12],
             [1650510557000,11],[1650510563000,11],[1650510569000,12],[1650510575000,18],
             [1650510581000,30],[1650510592000,30],[1650510594000,30],[1650510598000,32],
             [1650510609000,32],[1650510621000,32],[1650510624000,32],[1650510626000,32],
             [1650510631000,35],[1650510637000,36],[1650510647000,36],[1650510656000,36],
             [1650510666000,28],[1650510674000,28],[1650510679000,7],[1650510685000,7],
             [1650510689000,2],[1650510700000,2],[1650510717000,2],[1650510720000,0],
             [1650510725000,0],[1650510752000,0],[1650510759000,0],[1650510760000,0],
             [1650510763000,0],[1650510779000,0],[1650510780000,0],[1650510784000,0],
             [1650510798000,13],[1650510805000,13],[1650510810000,6],[1650510816000,7],
             [1650510822000,7],[1650510825000,7],[1650510829000,0],[1650510861000,0],
             [1650510862000,0],[1650510870000,0],[1650510921000,0],[1650510951000,0],
             [1650510983000,0],[1650510985000,0],[1650511016000,0],[1650511047000,0],
             [1650511078000,0],[1650511108000,0],[1650511117000,0],[1650511138000,0],
             [1650511147000,0],[1650511152000,0],[1650511158000,0],[1650511171000,0],
             [1650511176000,0],[1650511177000,0],[1650511179000,0],[1650511184000,0],
             [1650511191000,0],[1650511197000,0],[1650511202000,0],[1650511208000,0],
             [1650511225000,0],[1650511231000,0],[1650511234000,0],[1650511249000,0],
             [1650511255000,0],[1650511260000,0],[1650511266000,0],[1650511276000,45],
             [1650511284000,41],[1650511293000,39],[1650511303000,31],[1650511314000,35],
             [1650511324000,41],[1650511333000,39],[1650511343000,26],[1650511350000,20],
             [1650511356000,14],[1650511362000,16],[1650511368000,16],[1650511373000,18],
             [1650511379000,18],[1650511384000,16],[1650511390000,23],[1650511398000,3],
             [1650511412000,1],[1650511420000,0],[1650511425000,0],[1650511441000,0],
             [1650511450000,0],[1650511473000,0],[1650511479000,0],[1650511488000,0],
             [1650511518000,0],[1650511548000,0],[1650511552000,0],[1650511589000,0],
             [1650511621000,0],[1650511655000,0],[1650511686000,0],[1650511717000,0],
             [1650511747000,0],[1650511779000,0],[1650511809000,0],[1650511841000,0],
             [1650511852000,0],[1650511882000,0],[1650511912000,0],[1650511934000,0],
             [1650511939000,0],[1650511940000,0],[1650511943000,0],[1650511973000,0],
             [1650511974000,0],[1650511979000,0],[1650511984000,19],[1650512001000,20],
             [1650512007000,20],[1650512010000,20],[1650512012000,13],[1650512018000,7],
             [1650512024000,7],[1650512029000,4],[1650512035000,2],[1650512066000,2],
             [1650512069000,6],[1650512076000,6],[1650512081000,35],[1650512088000,30],
             [1650512095000,30],[1650512100000,27],[1650512106000,33],[1650512115000,33],
             [1650512120000,0],[1650512147000,0],[1650512152000,0],[1650512153000,14],
             [1650512159000,14],[1650512164000,32],[1650512170000,32],[1650512175000,52],
             [1650512182000,54],[1650512189000,54],[1650512191000,13],[1650512197000,15],
             [1650512203000,15],[1650512208000,13],[1650512214000,13],[1650512220000,14],
             [1650512227000,15],[1650512233000,12],[1650512239000,12],[1650512244000,0],
             [1650512250000,0],[1650512281000,0],[1650512285000,0],[1650512287000,0],
             [1650512289000,0],[1650512318000,0],[1650512348000,0],[1650512378000,0],
             [1650512409000,0],[1650512439000,0],[1650512441000,0],[1650512454000,0],
             [1650512455000,0],[1650512464000,0],[1650512469000,0],[1650512475000,1],
             [1650512485000,1],[1650512487000,40],[1650512497000,64],[1650512503000,58],
             [1650512510000,47],[1650512518000,47],[1650512520000,47],[1650512522000,26],
             [1650512528000,38],[1650512537000,41],[1650512545000,34],[1650512553000,34],
             [1650512559000,5],[1650512575000,0],[1650512594000,0],[1650512598000,0],
             [1650512624000,0],[1650512625000,0],[1650512626000,0],[1650512630000,0],
             [1650512635000,15],[1650512641000,15],[1650512646000,15],[1650512651000,16],
             [1650512657000,17],[1650512663000,17],[1650512668000,17],[1650512674000,17],
             [1650512679000,18],[1650512698000,18],[1650512699000,1],[1650512716000,0],
             [1650512721000,0],[1650512746000,0],[1650512755000,0],[1650512758000,0],
             [1650512767000,0],[1650512769000,0],[1650512797000,0],[1650512798000,0],
             [1650512827000,0],[1650512857000,0],[1650512887000,0],[1650512917000,0],
             [1650512947000,0],[1650512977000,0],[1650513008000,0],[1650513041000,0],
             [1650513098000,0],[1650513099000,0],[1650513131000,0],[1650513162000,0],
             [1650513192000,0],[1650513224000,0],[1650513254000,0],[1650513285000,0],
             [1650513317000,0],[1650513348000,0],[1650513397000,0],[1650513398000,0],
             [1650513427000,0],[1650513457000,0],[1650513488000,0],[1650513518000,0],
             [1650513549000,0],[1650513579000,0],[1650513610000,0],[1650513640000,0],
             [1650513698000,0],[1650513728000,0],[1650513758000,0],[1650513788000,0],
             [1650513818000,0],[1650513848000,0],[1650513878000,0],[1650513908000,0],
             [1650513938000,0],[1650513997000,0],[1650513998000,0],[1650514027000,0],
             [1650514057000,0],[1650514088000,0],[1650514119000,0],[1650514149000,0],
             [1650514179000,0],[1650514210000,0],[1650514240000,0],[1650514297000,0],
             [1650514298000,0]
             ];

             option = {
                 xAxis: {
                     type: 'time',
                 },
                 yAxis: {},
                 dataZoom: [{
                     type: 'inside',
                 }, {
                     type: 'slider',
                 }],
                 series: [{
                     type: 'line',
                     symbol: 'none',
                     data: data,
                 }]
             };

             var chart = testHelper.create(echarts, 'main0', {
                 title: [
                     'DataZoom on Time Axis',
                     'See #16978'
                 ],
                 option: option
                 // height: 300,
                 // buttons: [{text: 'btn-txt', onclick: function () {}}],
                 // recordCanvas: true,
             });
         });
         </script>


         <script>
             require([
                 'echarts',
                 // 'map/js/china',
                 // './data/nutrients.json'
             ], function (echarts) {
                 var option;
                 const data = [];
                 const amount = 10000;
                 for (let i = 0; i < amount; i++) {
                     data.push([
                         1650508472000 + i,
                         i > amount * 0.5 && i < amount * 0.7
                             ? 0
                             : Math.sin(i / 100) * 100
                     ]);
                 }

                 option = {
                     xAxis: {
                         type: 'time',
                     },
                     yAxis: {
                         type: 'value',
                     },
                     series: [{
                         type: 'line',
                         data: data,
                     }],
                     dataZoom: [{
                         type: 'inside',
                     }, {
                         type: 'slider',
                     }],
                 };

                 var chart = testHelper.create(echarts, 'main1', {
                     title: [
                         'DataZoom on Time Axis',
                         'large scale data'
                     ],
                     option: option
                 });
             });
         </script>
     </body>
 </html>
	<!DOCTYPE html>
	<!--
	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="ut/lib/canteen.js"></script> -->
	<link rel="stylesheet" href="lib/reset.css" />
	</head>
	<body>
	<style>
	</style>



	<div id="main0"></div>
	<div id="main1"></div>






	<script>
	require([
	'echarts',
	// 'map/js/china',
	// './data/nutrients.json'
	], function (echarts) {
	var option;

	const data = [
	[1650508472000,0],[1650508502000,0],[1650508532000,0],[1650508565000,0],
	[1650508596000,0],[1650508606000,0],[1650508626000,0],[1650508656000,0],
	[1650508686000,0],[1650508717000,0],[1650508772000,0],[1650508803000,0],
	[1650508833000,0],[1650508863000,0],[1650508893000,0],[1650508906000,0],
	[1650508923000,0],[1650508953000,0],[1650508985000,0],[1650509019000,0],
	[1650509071000,0],[1650509101000,0],[1650509132000,0],[1650509162000,0],
	[1650509194000,0],[1650509206000,0],[1650509224000,0],[1650509256000,0],
	[1650509286000,0],[1650509318000,0],[1650509373000,0],[1650509403000,0],
	[1650509433000,0],[1650509464000,0],[1650509494000,0],[1650509506000,0],
	[1650509524000,0],[1650509554000,0],[1650509586000,0],[1650509616000,0],
	[1650509672000,0],[1650509702000,0],[1650509734000,0],[1650509763000,0],
	[1650509794000,0],[1650509806000,0],[1650509824000,0],[1650509854000,0],
	[1650509884000,0],[1650509915000,0],[1650509973000,0],[1650510004000,0],
	[1650510034000,0],[1650510064000,0],[1650510095000,0],[1650510106000,0],
	[1650510125000,0],[1650510155000,0],[1650510185000,0],[1650510216000,0],
	[1650510271000,0],[1650510301000,0],[1650510333000,0],[1650510365000,0],
	[1650510395000,0],[1650510407000,0],[1650510425000,0],[1650510456000,0],
	[1650510486000,0],[1650510498000,0],[1650510504000,0],[1650510506000,0],
	[1650510510000,0],[1650510516000,0],[1650510527000,16],[1650510534000,16],
	[1650510540000,16],[1650510542000,16],[1650510546000,16],[1650510551000,12],
	[1650510557000,11],[1650510563000,11],[1650510569000,12],[1650510575000,18],
	[1650510581000,30],[1650510592000,30],[1650510594000,30],[1650510598000,32],
	[1650510609000,32],[1650510621000,32],[1650510624000,32],[1650510626000,32],
	[1650510631000,35],[1650510637000,36],[1650510647000,36],[1650510656000,36],
	[1650510666000,28],[1650510674000,28],[1650510679000,7],[1650510685000,7],
	[1650510689000,2],[1650510700000,2],[1650510717000,2],[1650510720000,0],
	[1650510725000,0],[1650510752000,0],[1650510759000,0],[1650510760000,0],
	[1650510763000,0],[1650510779000,0],[1650510780000,0],[1650510784000,0],
	[1650510798000,13],[1650510805000,13],[1650510810000,6],[1650510816000,7],
	[1650510822000,7],[1650510825000,7],[1650510829000,0],[1650510861000,0],
	[1650510862000,0],[1650510870000,0],[1650510921000,0],[1650510951000,0],
	[1650510983000,0],[1650510985000,0],[1650511016000,0],[1650511047000,0],
	[1650511078000,0],[1650511108000,0],[1650511117000,0],[1650511138000,0],
	[1650511147000,0],[1650511152000,0],[1650511158000,0],[1650511171000,0],
	[1650511176000,0],[1650511177000,0],[1650511179000,0],[1650511184000,0],
	[1650511191000,0],[1650511197000,0],[1650511202000,0],[1650511208000,0],
	[1650511225000,0],[1650511231000,0],[1650511234000,0],[1650511249000,0],
	[1650511255000,0],[1650511260000,0],[1650511266000,0],[1650511276000,45],
	[1650511284000,41],[1650511293000,39],[1650511303000,31],[1650511314000,35],
	[1650511324000,41],[1650511333000,39],[1650511343000,26],[1650511350000,20],
	[1650511356000,14],[1650511362000,16],[1650511368000,16],[1650511373000,18],
	[1650511379000,18],[1650511384000,16],[1650511390000,23],[1650511398000,3],
	[1650511412000,1],[1650511420000,0],[1650511425000,0],[1650511441000,0],
	[1650511450000,0],[1650511473000,0],[1650511479000,0],[1650511488000,0],
	[1650511518000,0],[1650511548000,0],[1650511552000,0],[1650511589000,0],
	[1650511621000,0],[1650511655000,0],[1650511686000,0],[1650511717000,0],
	[1650511747000,0],[1650511779000,0],[1650511809000,0],[1650511841000,0],
	[1650511852000,0],[1650511882000,0],[1650511912000,0],[1650511934000,0],
	[1650511939000,0],[1650511940000,0],[1650511943000,0],[1650511973000,0],
	[1650511974000,0],[1650511979000,0],[1650511984000,19],[1650512001000,20],
	[1650512007000,20],[1650512010000,20],[1650512012000,13],[1650512018000,7],
	[1650512024000,7],[1650512029000,4],[1650512035000,2],[1650512066000,2],
	[1650512069000,6],[1650512076000,6],[1650512081000,35],[1650512088000,30],
	[1650512095000,30],[1650512100000,27],[1650512106000,33],[1650512115000,33],
	[1650512120000,0],[1650512147000,0],[1650512152000,0],[1650512153000,14],
	[1650512159000,14],[1650512164000,32],[1650512170000,32],[1650512175000,52],
	[1650512182000,54],[1650512189000,54],[1650512191000,13],[1650512197000,15],
	[1650512203000,15],[1650512208000,13],[1650512214000,13],[1650512220000,14],
	[1650512227000,15],[1650512233000,12],[1650512239000,12],[1650512244000,0],
	[1650512250000,0],[1650512281000,0],[1650512285000,0],[1650512287000,0],
	[1650512289000,0],[1650512318000,0],[1650512348000,0],[1650512378000,0],
	[1650512409000,0],[1650512439000,0],[1650512441000,0],[1650512454000,0],
	[1650512455000,0],[1650512464000,0],[1650512469000,0],[1650512475000,1],
	[1650512485000,1],[1650512487000,40],[1650512497000,64],[1650512503000,58],
	[1650512510000,47],[1650512518000,47],[1650512520000,47],[1650512522000,26],
	[1650512528000,38],[1650512537000,41],[1650512545000,34],[1650512553000,34],
	[1650512559000,5],[1650512575000,0],[1650512594000,0],[1650512598000,0],
	[1650512624000,0],[1650512625000,0],[1650512626000,0],[1650512630000,0],
	[1650512635000,15],[1650512641000,15],[1650512646000,15],[1650512651000,16],
	[1650512657000,17],[1650512663000,17],[1650512668000,17],[1650512674000,17],
	[1650512679000,18],[1650512698000,18],[1650512699000,1],[1650512716000,0],
	[1650512721000,0],[1650512746000,0],[1650512755000,0],[1650512758000,0],
	[1650512767000,0],[1650512769000,0],[1650512797000,0],[1650512798000,0],
	[1650512827000,0],[1650512857000,0],[1650512887000,0],[1650512917000,0],
	[1650512947000,0],[1650512977000,0],[1650513008000,0],[1650513041000,0],
	[1650513098000,0],[1650513099000,0],[1650513131000,0],[1650513162000,0],
	[1650513192000,0],[1650513224000,0],[1650513254000,0],[1650513285000,0],
	[1650513317000,0],[1650513348000,0],[1650513397000,0],[1650513398000,0],
	[1650513427000,0],[1650513457000,0],[1650513488000,0],[1650513518000,0],
	[1650513549000,0],[1650513579000,0],[1650513610000,0],[1650513640000,0],
	[1650513698000,0],[1650513728000,0],[1650513758000,0],[1650513788000,0],
	[1650513818000,0],[1650513848000,0],[1650513878000,0],[1650513908000,0],
	[1650513938000,0],[1650513997000,0],[1650513998000,0],[1650514027000,0],
	[1650514057000,0],[1650514088000,0],[1650514119000,0],[1650514149000,0],
	[1650514179000,0],[1650514210000,0],[1650514240000,0],[1650514297000,0],
	[1650514298000,0]
	];

	option = {
	xAxis: {
	type: 'time',
	},
	yAxis: {},
	dataZoom: [{
	type: 'inside',
	}, {
	type: 'slider',
	}],
	series: [{
	type: 'line',
	symbol: 'none',
	data: data,
	}]
	};

	var chart = testHelper.create(echarts, 'main0', {
	title: [
	'DataZoom on Time Axis',
	'See #16978'
	],
	option: option
	// height: 300,
	// buttons: [{text: 'btn-txt', onclick: function () {}}],
	// recordCanvas: true,
	});
	});
	</script>



	<script>
	require([
	'echarts',
	// 'map/js/china',
	// './data/nutrients.json'
	], function (echarts) {
	var option;
	const data = [];
	const amount = 10000;
	for (let i = 0; i < amount; i++) {
	data.push([
	1650508472000 + i,
	i > amount * 0.5 && i < amount * 0.7
	? 0
	: Math.sin(i / 100) * 100
	]);
	}

	option = {
	xAxis: {
	type: 'time',
	},
	yAxis: {
	type: 'value',
	},
	series: [{
	type: 'line',
	data: data,
	}],
	dataZoom: [{
	type: 'inside',
	}, {
	type: 'slider',
	}],
	};

	var chart = testHelper.create(echarts, 'main1', {
	title: [
	'DataZoom on Time Axis',
	'large scale data'
	],
	option: option
	});
	});
	</script>
	</body>
	</html>