(1)做法为在series中添加yAxisIndex: 1,这个就可以,默认为yAxisIndex: 0,

(2)下面贴出来完整的代码

option = {

backgroundColor : 'rgba(43, 62, 75, 0.5)',//背景颜色

title : {

text : '引流实体',

x : 'center',

textStyle : {

color : '#FFF'

}

},

dataZoom: [//给x轴设置滚动条

{

start:dataZoom_end,

end: 100,

type: 'slider',

show: true,

xAxisIndex: [0],

height: 15,//组件高度

showDetail: false,//即拖拽时候是否显示详细数值信息 默认true

},

//下面这个属性是里面拖到

{

type: 'inside',

show: true,

xAxisIndex: [0],

start:dataZoom_end,

end: 100,

},

],

tooltip : {

trigger: 'axis',

axisPointer : { // 坐标轴指示器,坐标轴触发有效

type : 'line' // 默认为直线,可选为:'line' | 'shadow'

}

},

grid : {//间距距离左右下

//top: '50',

bottom: '45',

left : '1%',

right : '1%',

containLabel : true

},

legend: {

data:['掌上营业厅相关内容点击量','环比增幅'],

textStyle : {

color : '#FFF',

fontSize : 14

},

top:30

},

calculable : true,

xAxis : [

{

type : 'category',

data : dates,

splitLine : {//去掉网格线

show : false

},

axisLine : {//坐标轴轴线相关设置。

show : false,

lineStyle : {

color : '#FFF'

}

},

axisTick : {//坐标轴刻度相关设置

lineStyle : {

color : '#FFF'

}

},

axisLabel: {//x轴文字显示不全并将文字倾斜

interval:0,

rotate:40

}

}

],

yAxis : [

{

type : 'value',

name : '点击量(次)',

axisLabel : {

formatter: '{value}'

},

/*splitLine : {//去掉网格线

show : false

},*/

axisLine : {//坐标轴轴线相关设置。

show : false,

lineStyle : {

color : '#FFF'

}

},

axisTick : {//坐标轴刻度相关设置

show : false,

lineStyle : {

color : '#FFF'

}

},

},

{

type : 'value',

name: '环比增幅(pp%)',

axisLabel : {

formatter: '{value}%'

},

splitLine : {//去掉网格线

show : false

},

axisLine : {//坐标轴轴线相关设置。

show : false,

lineStyle : {

color : '#FFF'

}

},

axisTick : {//坐标轴刻度相关设置

show : false,

lineStyle : {

color : '#FFF'

}

},

}

],

series : [

{

name:'掌上营业厅相关内容点击量',

type:'bar',

data:values,

itemStyle : {

normal : {

color:'#ccecff',

label : {

textStyle : {

fontSize : '15',//柱状上的显示的文字

color:'#0fdc97'

}

}

}

},

},

{

name:'环比增幅',

type:'line',

yAxisIndex: 1,

data:val_float,

itemStyle : {

normal : {

color:'#fe9484',

label : {

textStyle : {

fontSize : '15',//柱状上的显示的文字

color:'#0fdc97'

}

}

}

},

}

]

};

echart 折线图设置y轴单位_echarts折线图有两个图例时如何实现分别采用两个不同单位的y轴...相关推荐

  1. echarts折线图不显示y轴值_Echarts 折线图y轴标签值太长时显示不全的解决办法

    问题 先看一下正常的情况 再看一下显示不全的情况 所有的数据都是从后台取的,也就是说动态变化的,一开始的时候数据量不大不会出现问题,后面y轴的值越来越大的时候就出现了这个显示不全的情况. 分析 先贴一 ...

  2. Revit中窗族的立面出图设置和构件显隐

    ​ 一.窗族的立面出图设置 Revit中,除了平面的出图设置以外还有立面的出图设置. 例如:如何在立面中,使窗户在精细详细程度显示的是窗的全部主体结构而在粗略/中等详细程度下是显示这样的样式呢? 在窗 ...

  3. 天创速盈:运营核心之测图测款, 拼多多测图测款怎么操作?

    在拼多多开店的商家应该知道,主图很重要.如果你建立了一个优秀的主图,你可以吸引很多商家的注意.主图设置好后,需要进行测图操作,看是否能满足要求.那么,拼多多测图测款是如何操作的呢?有哪些事项? 拼多多 ...

  4. echart 折线图设置y轴单位_如何让echarts中y轴的单位位于数值的右上角

    请问:如何让echarts中y轴的单位位于数值的右上角 1.创建折线图的数据区(包括年份和数据). 2.仅选择数据区创建折线图(插入选项卡/图表工具组/折线图). 3.得到的折线图x坐标不满足要求,在 ...

  5. js折线图设置y轴刻度_手绘风格的 JS 图表库:Chart.xkcd

    本文作者:HelloGitHub-kalifun 图表库千万个今天 HelloGitHub 给大家推荐个很有"特色"的图表库:一个手绘风格的 JS 图表库 -- Chart.xkc ...

  6. echarts 折线图 设置y轴最小刻度_用plotly和plt画图的基本设置(标题、坐标轴、图例、注释、图像)...

    参考链接:用plotly和plt画图的基本设置(标题.坐标轴.图例.注释.图像) - weixin_41670527的博客 - CSDN博客 非常好的文章,值得推荐. 一 用matplotlib.py ...

  7. echarts 折线图 设置y轴最小刻度_数据可视化—Echarts图表应用

    <错误>郑愁予 我打江南走过, 那等在季节里的容颜如莲花的开落,东风不来,三月的柳絮不飞.你的心如小小寂寞的城,恰若青石的街道向晚.蛩音不响,三月的春帷不揭,你的心是小小的窗扉紧掩.我达达 ...

  8. echarts切换折线图变大_Echarts折线图属性设置大全

    Echarts折线图属性设置大全 var option = { backgroundColor: '#FFF0F5', title: { text: '折线图', subtext: '模拟数据', x ...

  9. echarts折线图怎么从y轴开始_基于echarts的双y轴实时更新折线图

    一款基于echarts的双y轴实时更新折线图效果,页面加载后开始自动更新数据并绘制对应的折线图,可以点击右上角的按钮:显示数据视图.刷新数据和将数据存储为png的图片. 查看演示 下载资源: 46 次 ...

最新文章

  1. AI 八数码A_star算法问题-实验报告
  2. antd 函数组件_react函数组件中引用antd<Form/>组件demo
  3. 网络推广外包——网络推广外包指出新站上线前一定要做好自我检测
  4. mybatis不使用动态代理查询时设计与实现
  5. 王道计算机考研 计算机组成原理 第二章、数据的表示和运算
  6. 计算机电子表格公式应用和操作,计算机电子表格公式应用常见错误及处理
  7. 服务器共享文件监控,服务器共享文件监控
  8. 公安部计算机信息安全产品质量监督检验中心的质量责任和权限
  9. 在windows 2003系统上安装诺基亚pc套件的方法
  10. 最新图解 FileZilla Server + FlashFXP 快速傻瓜式搭建FTP服务 1
  11. iOS 最新AppStore申请加急审核 以及 apple联系方式大全
  12. 【Python】 使用 xlwt 保存 excel 文件无效 解决
  13. 51单片机c语言数组怎么用,51单片机之C语言-4.2数组
  14. 如何调试手机网页页面
  15. Unity SKFramework框架(一)、Audio音频管理器
  16. 程序员情人节防止割韭菜
  17. 基于李雅普诺夫函数的跟踪控制(一)
  18. 单片机MCU学习方法总结
  19. 一步一步理解Docker
  20. qt websocket android,QT使用websocket进行长连接

热门文章

  1. 如果有人把支付宝的服务器炸了,你的两毛五是不是就没了?
  2. 使用Oauth2实现微服务的安全保护
  3. 死磕Java并发:J.U.C之并发工具类:CyclicBarrier
  4. php抓取新浪微博数据抓取,php利用curl抓取新浪微博内容示例
  5. 华为mate 20pro升级鸿蒙,华为放大招!华为Mate20系列也能拍月亮,以后还能升级鸿蒙...
  6. kmeans实际应用例子 java_k-means聚类JAVA实例
  7. 如何将oracle数据库中的表结构导入到sqlserver中,Oracle转换成SqlServer数据库的步骤...
  8. C#机房重构-总结(一)
  9. python 调用c++ boost
  10. pip Can't connect to HTTPS URL because the SSL module is not available