需求:如图,y轴之间的距离太小,这样就太过于拥挤了,现在要修改echarts里面的属性,设置y轴值间隔让图表看上去舒服一些。

 
 

其实很多问题,真的只是因为自己没有好好的看文档,很多文档上面都写的清清楚楚的,主要是设置这段代码,max(设置y轴最大值)和splitNumber

总结一下公式就是,

max/ splitNumber=y轴值间隔

(比如将y轴200平均成5个点,每个点的间距就是40)


yAxis : [ { // 纵轴标尺固定
type : 'value',
scale : true,
max : 200,
min : 0,
splitNumber : 5,
boundaryGap : [ 0.2, 0.2 ]
} ],

可以看一下修改之后的结果:比之前好很多。

 
=====================================================================================================
//宽度 图的里面的宽度设置
series : [
{
name:'做市',
type:'bar',
stack: '总量',
/*itemStyle : { normal: {label : {show: true, position: 'insideTop',textStyle:{color:'#000'}}}},*/
data:serieszs
},
{
name:'协议',
type:'bar',
stack: '总量',
barWidth : 30,//柱图宽度
/*itemStyle : { normal: {label : {show: true, position: 'insideTop',textStyle:{color:'#000'}}}},*/
data:seriesyx
}
]

Echarts设置y轴值间隔 以及设置 barWidth : 30,//柱图宽度的更多相关文章

  1. echarts设置y轴值间隔

    其中min.max可以自定义可以动态获取数据 yAxis : [ {                        type : 'value',                        axi ...

  2. echarts 修改y轴刻度间隔问题

    其中min.max可以自定义可以动态获取数据 yAxis : [ {                        type : 'value',                        axi ...

  3. Echarts-柱状图柱图宽度设置

    先看两张图 图中柱图只需要设置series中的坐标系属性barWidth就可以, 这种图柱状图,折叠柱状图都适应 eg: /** * 堆积柱状图 * @param xaxisdata x轴:标签(数组 ...

  4. echarts统计图Y轴(或X轴)文字过长问题解决

    echarts 统计图Y轴文字过长 在使用echarts时,出现数值非常大,Y轴又显示不下的情况就需要压缩Y轴数值刻度. 解决方法: yAxis: { type: 'value', axisLabel ...

  5. echarts使用记录(二)legend翻页,事件,数据集,设置y轴最大/小值,让series图形从右侧出往左移动

    1.有时候legend比较多的时候,需要做翻页比较好,有个属性legend的type属性设置为scroll,然后animation可以控制动画,官方文档均可查. 再就是scrollDataIndex, ...

  6. 坐标轴刻度取值算法-基于魔数数组-源于echarts的y轴刻度计算需求

    本文链接:https://blog.csdn.net/qq_26909801/article/details/96966372数值型坐标轴刻度计算算法前言算法描述上代码代码运行效果结语前言因实习的公司 ...

  7. python matplotlib 设置x轴文本间隔显示(数字的话可以转为字符之后处理)

    一个国际友人绘图遇到的问题,查了一手资料.主要参考的是这个老哥的做法(https://blog.csdn.net/wyquin/article/details/80508260) #totalSeed ...

  8. highcharts设置Y轴范围及根据Y轴范围设置不同颜色

    yAxis : { title : { text : '数据' }, plotLines : [ { value : 0, width : 1, color : '#808080' } ], min: ...

  9. matlab画图:设置y轴位置,使y轴在x轴的中间

    sigmoid函数图像 x=-10:0.1:10;  y=sigmf(x,[1 0]);  plot(x,y) 画出的图像如下所示: 怎么将Y轴放在中间呢,而不是在左边? 即如何得到这种效果呢? 方法 ...

随机推荐

  1. sass - for循环写法

    如要设置多个li的动画延迟时间时 注:这里选择器要加#{}才行 不然就会编译成: 6.7. 插值语句 #{} (Interpolation: #{}) 通过 #{} 插值语句可以在选择器或属性名中使用 ...

  2. java和c# md5加密

    MD5加密的方式有很多,加盐的方式更多,最近项目需要java和c#加密结果一致,形成方法如下: 1.c#加密方法/// <summary> /// MD5 加密字符串 /// </s ...

  3. kotlin中val和var的区别

    var: var是一个可变变量,这是一个可以通过重新分配来更改为另一个值的变量.这种声明变量的方式和Java中声明变量的方式一样.val: val是一个只读变量,这种声明变量的方式相当于java中的f ...

  4. Kotlin从零到精通Android开发

    作者 博客地址 https://blog.csdn.net/aqi00 最新源代码 https://github.com/aqi00/kotlin 资源下载和内容勘误  https://blog.cs ...

  5. openresty开发系列2--nginx的简单安装,正向、反向代理及常用命令和信号控制介绍

    openresty开发系列2--nginx的简单安装,正向.反向代理及常用命令和信号控制介绍 一.nginx的安装下载及编译安装1.Nginx下载:nginx-1.13.0.tar.gz,下载到:/u ...

  6. shell编程系列19--文本处理三剑客之awk中的字符串函数

    shell编程系列19--文本处理三剑客之awk中的字符串函数 字符串函数对照表(上) 函数名 解释 函数返回值 length(str) 计算字符串长度 整数长度值 index(str1,str2) ...

  7. vector 移除元素

    vector中移除“与某值相等”的第一个元素. std::vector<Elem> coll; ... //remove first element with value val std: ...

  8. [译]在Pandas的Dataframe中删除行、列

    导入模块 import pandas as pd 创建dataframe data = {'name': ['Jason', 'Molly', 'Tina', 'Jake', 'Amy'], 'yea ...

  9. prometheus数据格式

    注意区分以下两种“数据格式”: 1.自定义exporter的时候所需要遵循的给prometheus提供数据的数据格式: https://yunlzheng.gitbook.io/prometheus- ...

  10. 《MySQL必知必会》学习笔记——前言

    前言 MySQL已经成为世界上最受欢迎的数据库管理系统之一.无论是用在小型开发项目上,还是用来构建那些声名显赫的网站,MySQL都证明了自己是个稳定.可靠.快速.可信的系统,足以胜任任何数据存储业务的 ...