echarts3在Y轴上做基准线
应用场景,有时候需要使用echarts在图形上绘制一条平行于Y轴的平行线用来分割x轴的前后数据,在查文档时遇到一些问题,
特意在这里记录下来,也是分享一下所得
其中基准线使用配置项markline,而markline配置项是在options的series数组对象数据中,配置项层级结构是这样的
options=>series=>markLine: {
itemStyle: {
normal: { lineStyle: { type: 'dashed', color: 'rgb(10,10,255)' } ,label:{formatter:'预报依据时间'}}//设置基线名称和样式
},
large: true,
data: [
{ name: '预报依据时间', xAxis: this.curveXdate(new Date(new Date().setHours(0, 0, 0, 0)).getTime() + 8 * 60 * 60 * 1000) },// 这里xAxis的值是X轴坐标
]
}
在这里我用了两个Y轴展示数据信息,所以这里也介绍一下,配置信息是在options的yAxis数组中
yAxis: [
{
type: 'value',
name:'水位',
min: function (value) {
return Math.floor(value.min * 0.97);
},
max: function (value) {
return Math.floor(value.max * 1.1);
}
},
{
type: 'value',
name:'流量',
min: function (value) {
return Math.floor(value.min * 0.97);
},
max: function (value) {
return Math.floor(value.max * 1.1);
}
}
],
可以看到这里在yAxis中声明了两个对象,这两个对象其实就是两个Y轴数据,而如何让X轴数据信息对应到不同的Y轴
这里也要配置一下,我们应该都知道图形展示的数据是在series数组对象中,而每个数组对象默认采用的都是yAxis的第一个数组对象Y轴,所以这里我们要在series数组对象中添加配置项==》 yAxisIndex: 1,这样就能让数据信息找到对应的Y轴
echarts3在Y轴上做基准线相关推荐
- 更改matplotlib中x或y轴上的“刻度频率”?
本文翻译自:Changing the "tick frequency" on x or y axis in matplotlib? I am trying to fix how p ...
- 设位于第一象限的曲线y=f(x)上的任一点P(x,y)的切线在x轴上的截距等于该点发现在y轴上截距的相反数,且曲线经过(1,0),求该曲线
高数微分方程题目:设位于第一象限的曲线y=f(x)上的任一点P(x,y)的切线在x轴上的截距等于该点发现在y轴上截距的相反数,且曲线经过(1,0),求该曲线.
- 【计算机图形学】中点画线法实现焦点在x、y轴上的椭圆绘制
[计算机图形学]中点画线法实现焦点在x.y轴上的椭圆绘制 一.中点画线法原理简介 1.建立基础 中点画线法的原理介绍见直线绘制的博文中点画线法实现任意斜率直线的绘制.基本思路是以下一点在椭圆外/内的位 ...
- wxCharts修改X轴或者Y轴上的字体颜色
自己摸索了wxCharts,最后发现网上有很多,但都解决不了我的需求.所以去看了官方文档,本来不想看的(嫌太多了).后知后觉,看文档才是真的省时间.附上url:官方-wxCharts使用文档 代码: ...
- echarts折线图取消折线上圆点,设置线条为虚线,设置第一个点在y轴上,拐点是曲线,线条下加填充区域
series--->symbol: "none" 取消折线上的圆点 设置线条为虚线 series: [{itemStyle:{normal:{lineStyle:{w ...
- 6、利用三角函数求物体速度分解到 x 轴和 y 轴上的分速度
一个物体以每帧1像素的速度向45度的方向移动,我们把该速度分解成x轴和y轴上的速度vx和vy,物体位于x轴上的边和y轴上的边,与物体的运动轨迹形成一个直角三角形,,三角形的两条邻边恰好落在x. ...
- html 占用空间 滚动轴_html – 缩放子级上的溢出滚动:X和Y轴上的不同行为
>有一个固定大小的容器,包含一个固定大小的儿童. >有溢出滚动. >然后,我通过转换缩小孩子,将其大小减半. > X滚动消失,因为子宽度为200px(更具体地说,容器的scro ...
- echarts x轴 字 纵向_echarts柱状图表标题的位置竖立在Y轴上?
自己做的,第一个是我自己做的, 想要把标题改成第二的样式, 在线等, 比较急, 求帮忙 怎么把Y轴的标题往左边调一点点 想要移动的位置 js let option = { color: [" ...
- python画图设置坐标轴为科学记数法_python – Seaborn / Matplotlib:如何在factorplot y轴上抑制科学记数法...
这个问题下面的简单示例我无法解决. 注:其他一些Seaborn绘图方法似乎有抑制指数形式的论据,但看似不是factorplots.我尝试了一些Matplotlib解决方案,包括similar ques ...
最新文章
- 基于插件化的企业级开发平台JXADF(开源)
- 小心VB.NET中的除运算符/和/
- 高一学生计算机知识现状分析,关于高中信息技术课教学现状的思考
- shell 中 $(( )) 与 $( ) 还有 ${ } 的区别
- 美国人用什么android手机,美国过半消费者使用智能手机 Android占48.5%
- 移动端最小字体限制测试
- SpringDataJpa 概述
- 阿里巴巴Android开发手册V1.0.0随手笔记
- 史上最全的 iOS 各种测试工具集锦,看看有没有你不知道的
- vue中select的option默认选中项的问题解决方案
- 基于自抗扰控制的高速列车自动驾驶速度控制
- matlab教程 导入数据,MATLAB数据导入
- iOS历史回顾(iOS1~iOS8)
- 金蝶软件核算项目的介绍及使用
- 离散数学-各种关联词的符号化
- 传感器 | 密度测量系列:1.密度测量的基础知识
- 怎么制作九宫格切图?这两个方法非常简单
- 顺序容器迭代器之鄙见
- contest1 CF70 BetaRound ooxxx ooxxx ooooo
- 神州战神笔记本开启/关闭键盘背光灯的方法,control center使用配置,控制风扇转速,减少噪音
热门文章
- 用Python ttkbootstrap 带你制作账户注册信息界面
- Joint fully convolutional and graph convolutional networks for weakly-supervised segmentation of
- 模式识别作业2——SYSU
- lzma java sdk,如何使用LZMA SDK在Java中压缩/解压缩
- ASCII二进制一键转换
- Internet Download Manager v6.41.3中文特别版IDM下载器免费下载
- 32怎么通过一个按键实现不同工作模式_游戏工作室防封IP,免费领!!!魔兽世界怀旧版独享IP免费送...
- 呼叫中心系统对接开发-网关和中继的对接
- A律十三折线法G711编解码介绍
- BTC 复制节点(节点复制)复制区块数据,实现快速同步区块数据