Toggle navigation
用背景颜色来表示合法范围
By
我是个小胖子i
2018-01-22 07:35:00
脚本
16
21
作品使用的第三方脚本
数据管理
上传数据
支持小于 5M 任意格式（csv, xlsx, json, xml, ...）的数据文件
上传后可以通过生成的文件链接异步获取托管的数据。
历史数据
0 条
无历史数据
代码修改记录
信息提示
保存作品
对当前截图不满意？你还可以
上传本地截图
重新截图
作品名称
作品描述
标签
geo
grid
legend
markLine
markPoint
bar
effectScatter
line
lines
map
timeline
title
toolbox
tooltip
visualMap
作品默认版本
最新
16
15
14
13
12
11
10
9
8
7
6
5
4
3
2
1
20:11:45
图表已生成
整理代码
刷新
代码
var timeData = [ '0:00', '0:30', '1:00', '1:30', '2:00', '2:30', '3:00', '3:30', '4:00', '4:30', '5:00', '5:30', '6:00', '6:30', '7:00', '7:30', '8:00', '8:30', '9:00', '9:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30' ]; option = { title: { text: '多个背景颜色图', x: 'left', }, tooltip: { trigger: 'axis', axisPointer: { animation: false } }, legend: { data:['舒张压','收缩压'] }, toolbox: { feature: { dataZoom: { yAxisIndex: 'none' }, restore: {}, saveAsImage: {} } }, axisPointer: { link: { xAxisIndex: 'all' } }, dataZoom: [{ show: true, realtime: true, start: 30, end: 70, xAxisIndex: [0, 1] }, { type: 'inside', realtime: true, start: 30, end: 70, xAxisIndex: [0, 1] }], grid: [{ left: 40, right: 40, }, { left: 40, right: 40, }], xAxis: [{ type: 'category', boundaryGap: false, axisLine: { onZero: true }, data: timeData }, { gridIndex: 1 }], yAxis: [{ type: 'value', max: 260, name: '单位 : mmHg', min: 0, interval: 25, }, { gridIndex: 1 }], series: [{ name: '舒张压', type: 'line', smooth: true, symbol: 'circle', symbolSize: 9, showSymbol: false, lineStyle: { normal: { width: 1 } }, markArea: { silent: true, label: { normal: { position: ['10%', '50%'] } }, data: [ [{ name: '', yAxis: 52, itemStyle: { normal: { color: 'rgba(0,153,153,0.27)' } }, }, { yAxis: 104 }], [{ name: '', yAxis: 156, itemStyle: { normal: { color: 'rgba(153,204,51,0.2)' } }, }, { yAxis: 208, }] ] }, data: [ 70,70,72,75,76,78,71,79, 70,70,72,75,76,78,71,79, 70,70,72,75,76,78,71,79] }, { name: '收缩压', type: 'line', smooth: true, symbol: 'circle', symbolSize: 9, showSymbol: false, data: [ 160,170,172,175,176,178,171,179, 170,170,172,175,176,175,176,178,171,179, 170,170,172,175,176] } ] }; var timeData = [ '0:00', '0:30', '1:00', '1:30', '2:00', '2:30', '3:00', '3:30', '4:00', '4:30', '5:00', '5:30', '6:00', '6:30', '7:00', '7:30', '8:00', '8:30', '9:00', '9:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00', '18:30', '19:00', '19:30', '20:00', '20:30', '21:00', '21:30', '22:00', '22:30', '23:00', '23:30' ]; option = { title: { text: '多个背景颜色图', x: 'left', }, tooltip: { trigger: 'axis', axisPointer: { animation: false } }, legend: { data:['舒张压','收缩压'] }, toolbox: { feature: { dataZoom: { yAxisIndex: 'none' }, restore: {}, saveAsImage: {} } }, axisPointer: { link: { xAxisIndex: 'all' } }, dataZoom: [{ show: true, realtime: true, start: 30, end: 70, xAxisIndex: [0, 1] }, { type: 'inside', realtime: true, start: 30, end: 70, xAxisIndex: [0, 1] }], grid: [{ left: 40, right: 40, }, { left: 40, right: 40, }], xAxis: [{ type: 'category', boundaryGap: false, axisLine: { onZero: true }, data: timeData }, { gridIndex: 1 }], yAxis: [{ type: 'value', max: 260, name: '单位 : mmHg', min: 0, interval: 25, }, { gridIndex: 1 }], series: [{ name: '舒张压', type: 'line', smooth: true, symbol: 'circle', symbolSize: 9, showSymbol: false, lineStyle: { normal: { width: 1 } }, markArea: { silent: true, label: { normal: { position: ['10%', '50%'] } }, data: [ [{ name: '', yAxis: 52, itemStyle: { normal: { color: 'rgba(0,153,153,0.27)' } }, }, { yAxis: 104 }], [{ name: '', yAxis: 156, itemStyle: { normal: { color: 'rgba(153,204,51,0.2)' } }, }, { yAxis: 208, }] ] }, data: [ 70,70,72,75,76,78,71,79, 70,70,72,75,76,78,71,79, 70,70,72,75,76,78,71,79] }, { name: '收缩压', type: 'line', smooth: true, symbol: 'circle', symbolSize: 9, showSymbol: false, data: [ 160,170,172,175,176,178,171,179, 170,170,172,175,176,175,176,178,171,179, 170,170,172,175,176] } ] };
