在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双轴图的配置.的更多相关文章

  1. HighCharts之2D柱状图、折线图的组合双轴图

    HighCharts之2D柱状图.折线图的组合双轴图 1.实例源码 DoubleAxis.html: <!DOCTYPE html> <html> <head> & ...

  2. 如何拼接FusionCharts的JSON格式的双轴图

    1.问题背景 假如,项目中遇到这样一个问题:利用FusionCharts中的JSON格式拼接双轴图,并将JSON字符串转换成JSON对象传输到前台,在页面上展示出来. 2.设计源码 /** * * @ ...

  3. pyhton中matplotlib箱线图的绘制(matplotlib双轴图、箱线图、散点图以及相关系数矩阵图))

    //2019.07.23 1.箱形图,又称为盒式图,一般可以很好地反映出数据分布的特征,也可以进行多项数据之间分布特征的比较,它主要包含五个基础数据:中位数,两个上下分位数以及上下边缘线数据 其中的一 ...

  4. Highcharts 测量图;Highcharts 圆形进度条式测量图;Highcharts 时钟;Highcharts 双轴车速表;Highcharts 音量表(VU Meter)

    Highcharts 测量图 配置 chart.type 配置 配置 chart 的 type 为 'gauge' .chart.type 描述了图表类型.默认值为 "line". ...

  5. Flex实现双轴条状图

    1.问题背景 一般的,柱状图可以实现双轴图,但是如何实现双轴条状图? 2.实现实例 <?xml version="1.0" encoding="utf-8" ...

  6. echarts之折线图配置(附带图例很多做成分页效果)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  7. echarts折现图配置

    js引用和div容器 <div id="container" style="height: 100%"></div> <scrip ...

  8. Python Pandas 时间序列双轴折线图

    时间序列pv-gmv双轴折线图 import numpy as np import pandas as pd import matplotlib.pyplot as plt n = 12 date_s ...

  9. [置顶] echarts x轴文字显示不全(xAxis文字倾斜比较全面的3种做法值得推荐)

    echarts x轴标签文字过多导致显示不全 如图: 解决办法1:xAxis.axisLabel 属性 axisLabel的类型是object ,主要作用是:坐标轴刻度标签的相关设置.(当然yAxis ...

随机推荐

  1. php练习7——类的运用(四则运算or面积计算[javascript小技巧——根据需求显示不同界面])

    要求:请编写一个类,该类可以进行四则运算,也可以进行矩形面积计算 1.程序 viewCount.html  Count.class.php      printCount.php 2.结果      ...

  2. phpstorm配置Xdebug进行调试PHP教程

    运行环境: PHPSTORM版本 : 8.0.1 PHP版本 : 5.6.2 xdebug版本:php_xdebug-2.2.5-5.6-vc11-x86_64.dll ps : php版本和xdeb ...

  3. 上传文件格式控制的困惑(application/octet-stream 限制不了BAT等格式上传)问题解决

    允许上传类型部分代码 $uptypes=array(  //上传文件类型列表 'image/gif', 'image/jpg', 'image/jpeg', 'image/pjpeg', 'image ...

  4. Windows下MySQL数据库备份脚本(一)

    说明: MySQL数据库安装目录:C:\Program Files\MySQL\MySQL Server 5.0 MySQL数据库存放目录:C:\Program Files\MySQL\MySQL S ...

  5. python学习_数据处理编程实例(一)

    目的:用一个实例总结学习到的with语句,函数,列表推导,集合,排序,字符分割等内容 要求:分别以james,julie,mikey,sarah四个学生的名字建立文本文件,分别存储各自的成绩,时间格式 ...

  6. 工作流软件如何成为未来web的支柱

    此文作者是 Kevin Lindquist,工作流平台Decisions的营销负责人,原文发表于VB上. Web 3.0 正在敲门,但是开门的人你永远都想不到:工作流软件. 传统上工作流软件是企业级的 ...

  7. UM_第三方登录

    参考官方文档(http://dev.umeng.com/social/ios/detail-share#7), 做出以下总结. 第三方登录主要用于简化用户登录流程,通过用户拥有的微博.QQ.微信等第三 ...

  8. OpenTSDB案例总结

    加宽行可增加扫描速度 采用组合rowkey,利用数据本地性加快扫描 少数宽行,并不比多数窄行节省空间 缩短Column family 和 column的名字 合并若干列.

  9. hdu 1281

    二分图,简单的模板题,不过题目比较难懂: 其中important chess就是删掉它不能够完美匹配,所以就枚举每一个可能删的棋子: 代码: #include <cstdio> #incl ...

  10. 码云分布式之 Brzo 服务器

    摘要: 码云是国内最大的代码托管平台,为了支持更大的用户规模,开发团队也在对一些组件进行大规模的重构. 前言 码云是国内最大的代码托管平台.码云基于 Gitlab 5.5 开发,经过几年的开发已经和官 ...