Echarts双轴图的配置.
在series中的数据组加个属性,yAxisIndex: 1,表示第二个数据用的是第二个y轴,不加这个属性的话都是默认0,即第一个属性,再配置yAxis的值第一个为左侧坐标轴,右册坐标轴为第二个配置参数的值.
optionC = {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['蒸发量', '降水量', '平均温度']
},
xAxis: [{
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
}],
yAxis: [{
type: 'value',
name: '水量',
min: 0,
max: 250,
interval: 50,
axisLabel: {
formatter: '{value} ml'
}
},
{
type: 'value',
name: '温度',
min: 0,
max: 25,
interval: 5,
axisLabel: {
formatter: '{value} °C'
}
}
],
series: [{
name: '蒸发量',
type: 'bar',
data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name: '降水量',
type: 'bar',
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
},
{
name: '平均温度',
type: 'line',
yAxisIndex: 1,
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
}
]
};
Echarts双轴图的配置.的更多相关文章
- HighCharts之2D柱状图、折线图的组合双轴图
HighCharts之2D柱状图.折线图的组合双轴图 1.实例源码 DoubleAxis.html: <!DOCTYPE html> <html> <head> & ...
- 如何拼接FusionCharts的JSON格式的双轴图
1.问题背景 假如,项目中遇到这样一个问题:利用FusionCharts中的JSON格式拼接双轴图,并将JSON字符串转换成JSON对象传输到前台,在页面上展示出来. 2.设计源码 /** * * @ ...
- pyhton中matplotlib箱线图的绘制(matplotlib双轴图、箱线图、散点图以及相关系数矩阵图))
//2019.07.23 1.箱形图,又称为盒式图,一般可以很好地反映出数据分布的特征,也可以进行多项数据之间分布特征的比较,它主要包含五个基础数据:中位数,两个上下分位数以及上下边缘线数据 其中的一 ...
- Highcharts 测量图;Highcharts 圆形进度条式测量图;Highcharts 时钟;Highcharts 双轴车速表;Highcharts 音量表(VU Meter)
Highcharts 测量图 配置 chart.type 配置 配置 chart 的 type 为 'gauge' .chart.type 描述了图表类型.默认值为 "line". ...
- Flex实现双轴条状图
1.问题背景 一般的,柱状图可以实现双轴图,但是如何实现双轴条状图? 2.实现实例 <?xml version="1.0" encoding="utf-8" ...
- echarts之折线图配置(附带图例很多做成分页效果)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- echarts折现图配置
js引用和div容器 <div id="container" style="height: 100%"></div> <scrip ...
- Python Pandas 时间序列双轴折线图
时间序列pv-gmv双轴折线图 import numpy as np import pandas as pd import matplotlib.pyplot as plt n = 12 date_s ...
- [置顶]
echarts x轴文字显示不全(xAxis文字倾斜比较全面的3种做法值得推荐)
echarts x轴标签文字过多导致显示不全 如图: 解决办法1:xAxis.axisLabel 属性 axisLabel的类型是object ,主要作用是:坐标轴刻度标签的相关设置.(当然yAxis ...
随机推荐
- 项目规范和建立-从frozenui学习
1.分支branches开发新功能,主干trunk是稳定发布的.因为frozenui下载完,看到branches比trunk多了一个版本 2.版本号定义,主版本.次版本.修订号 大版本号: 主版本号: ...
- linux下 链接 sqlserver数据库 驱动的安装
1.必需安装freetds 安装pdo_dblib扩展首先需要安装freetds. freeTDS的最新稳定版是0.91,这个可以在官网上下载http://www.freetds.org/ ,也可以在 ...
- ubuntu下php开发环境搭建,nginx+(cgi)php5fpm+memcached+xdebug
由于只是开发环境,所以都是选择比较简单的apt-get安装方式 ,但中间也遇到一点问题. 首先安装nginx nginx的安装和配置其实很简单,nginx本身非常轻量级, 直接 sudo apt-ge ...
- 网站seo优化--jsoup 批量分析相关网站 标签,描述,关键词.
网站seo优化--jsoup 批量分析相关网站 标签,描述,关键词. 因为自己写了一个磁力搜索网站Btgoogle,准备进行优化一下,需要分析其他的网站的优化情况. Java的Jsoup类库和PHP的 ...
- 3D 服务器端以向量计算为主的角色位置的算法
把我以前学习过的一个东西拿出来分享下~ 3D服务器端玩家行走处理是服务器端根据客户端行走路径.玩家行走时间以及速度(包括变化速度)计算得出玩家的当前位置. 由于客户端行走是一条路径,不使用2D中的格子 ...
- usb host和usb device
S3C2440的数据手册将USB功能分为两章--usb host和usb device.具体什么意思呢? usb host: 微处理器作为usb主设备,可以挂接U盘之类的从属设备. usb devic ...
- 从 IT 的角度思考 BIM(一):面向对象
还记得那个笑话吗:要把大象放进冰箱,总共分几步?这不仅仅是一个笑话,还是一个值得我们好好分析的笑话. 如果要放进冰箱的是一个苹果,那么也就不可笑了,但换成大象,就引起了我们的兴趣和注意,为什么? 我们 ...
- const char*, char const*, char*const的区别
http://www.cnblogs.com/aduck/articles/2244884.html
- Win7资源管理器已停止工作——StackHash_6c37,R6205错误
2013-9-20 此问题由来已久,截图及"问题签名"如下: 问题签名: 问题事件名称: BEX64 应用程序名: Explorer.EXE 应用程序版本: 6.1.7601. ...
- 改善C#程序的50种方法
为什么程序已经可以正常工作了,我们还要改变它们呢?答案就是我们可以让它们变得更好.我们常常会改变所使用的工具或者语言,因为新的工具或者语言更富生产力.如果固守旧有的习惯,我们将得不到期望的结果.对于C ...