You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
gentelella/vendors/echarts/test/diff.html

98 lines
2.9 KiB

<html>
<head>
<meta charset="utf-8">
<script src="esl.js"></script>
<script src="config.js"></script>
<meta name="viewport" content="user-scalable=no,width=device-width,height=device-height">
</head>
<body>
<style>
html, body, #main {
width: 100%;
height: 100%;
margin: 0;
}
</style>
<div id="main"></div>
<script>
require([
'echarts',
'echarts/chart/line',
'echarts/component/legend',
'echarts/component/grid',
'echarts/component/tooltip',
'echarts/component/toolbox',
'echarts/component/title',
'echarts/component/dataZoom'
], function (echarts) {
chart = echarts.init(document.getElementById('main'), null, {
renderer: 'canvas'
});
chart.setOption({
toolbox: {
show : true,
feature : {
dataZoom: {show: true},
restore: {show: true}
}
},
animationDurationUpdate: 4000,
xAxis: [
{
type: 'category',
data: ['a', 'b', 'c', 'd']
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
type:'line',
data: [
200, 100, 500, 300
]
}
]
});
})
// setTimeout(function () {
// chart.setOption({
// xAxis: {
// data: ['b', 'c', 'd', 'e']
// },
// series: [
// {
// data: [
// 100, 500, 300, 900
// ]
// }
// ]
// })
// }, 3000);
setTimeout(function () {
chart.setOption({
xAxis: {
data: ['a', 'd', 'c', 'b']
},
series: [
{
data: [
200, 300, 500, 100
]
}
]
})
}, 3000);
</script>
</body>
</html>