Echart横坐标时间轴滑动
2024-09-22 00:32:17
主要针对于dataZoom的使用，代码如下：
option = {
title: {
text: '未来一周气温变化',
subtext: '纯属虚构'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['最高气温','最低气温']
},
toolbox: {
show: true,
feature: {
dataZoom: {
yAxisIndex: 'none'
},
dataView: {readOnly: false},
magicType: {type: ['line', 'bar']},
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一','周二','周三','周四','周五','周六','周日']
},
yAxis: {
type: 'value',
axisLabel: {
formatter: '{value} °C'
}
},
"dataZoom": [
{
"show": true,
"height": ,
"xAxisIndex": [
],
bottom:,
"start": ,
"end":
},
{
"type": "inside",
"show": true,
"height": ,
"xAxisIndex": [
],
"start": ,
"end":
}],
series: [
{
name:'最高气温',
type:'line',
data:[, , , , , , ],
markPoint: {
data: [
{type: 'max', name: '最大值'},
{type: 'min', name: '最小值'}
]
},
markLine: {
data: [
{type: 'average', name: '平均值'}
]
}
},
{
name:'最低气温',
type:'line',
data:[, -, , , , , ],
markPoint: {
data: [
{name: '周最低', value: -, xAxis: , yAxis: -1.5}
]
},
markLine: {
data: [
{type: 'average', name: '平均值'},
[{
symbol: 'none',
x: '90%',
yAxis: 'max'
}, {
symbol: 'circle',
label: {
normal: {
position: 'start',
formatter: '最大值'
}
},
type: 'max',
name: '最高点'
}]
]
}
}
]
};
最新文章
- css知多少之绝对定位小记
- VB检测按键CTRL+C的次数
- Spark实战4:异常检测算法Scala语言
- 正则表达式匹配完整img标签php实现
- UVA5876 Writings on the Wall 扩展KMP
- WDS 的两种实现方式
- 修复Debian（Ubuntu）Grub2 引导
- [转载]C#多线程学习(一) 多线程的相关概念
- Maven assembly插件输出文件乱码问题
- hdu1824(two-sat)
- 如何清理Docker占用的磁盘空间?(转载)
- debugging kubernetes (Delve and Goland)
- Bootstrap知识记录：排版样式
- git遇到的问题 .Git: There is no tracking information for the current branch.
- MapReduce 过程详解
- Calendar类的使用——闰年的计算
- skipper backend 负载均衡配置
- 企业官网Web原型制作分享-Tesla
- hdu 5427(排序水题)
- JProfiler远程监控Linux上Tomcat的安装过程细讲（步骤非常详细！！！）