Echarts设置y轴值间隔 以及设置 barWidth : 30,//柱图宽度
需求:如图,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,//柱图宽度的更多相关文章
- echarts设置y轴值间隔
其中min.max可以自定义可以动态获取数据 yAxis : [ { type : 'value', axi ...
- echarts 修改y轴刻度间隔问题
其中min.max可以自定义可以动态获取数据 yAxis : [ { type : 'value', axi ...
- Echarts-柱状图柱图宽度设置
先看两张图 图中柱图只需要设置series中的坐标系属性barWidth就可以, 这种图柱状图,折叠柱状图都适应 eg: /** * 堆积柱状图 * @param xaxisdata x轴:标签(数组 ...
- echarts统计图Y轴(或X轴)文字过长问题解决
echarts 统计图Y轴文字过长 在使用echarts时,出现数值非常大,Y轴又显示不下的情况就需要压缩Y轴数值刻度. 解决方法: yAxis: { type: 'value', axisLabel ...
- echarts使用记录(二)legend翻页,事件,数据集,设置y轴最大/小值,让series图形从右侧出往左移动
1.有时候legend比较多的时候,需要做翻页比较好,有个属性legend的type属性设置为scroll,然后animation可以控制动画,官方文档均可查. 再就是scrollDataIndex, ...
- 坐标轴刻度取值算法-基于魔数数组-源于echarts的y轴刻度计算需求
本文链接:https://blog.csdn.net/qq_26909801/article/details/96966372数值型坐标轴刻度计算算法前言算法描述上代码代码运行效果结语前言因实习的公司 ...
- python matplotlib 设置x轴文本间隔显示(数字的话可以转为字符之后处理)
一个国际友人绘图遇到的问题,查了一手资料.主要参考的是这个老哥的做法(https://blog.csdn.net/wyquin/article/details/80508260) #totalSeed ...
- highcharts设置Y轴范围及根据Y轴范围设置不同颜色
yAxis : { title : { text : '数据' }, plotLines : [ { value : 0, width : 1, color : '#808080' } ], min: ...
- matlab画图:设置y轴位置,使y轴在x轴的中间
sigmoid函数图像 x=-10:0.1:10; y=sigmf(x,[1 0]); plot(x,y) 画出的图像如下所示: 怎么将Y轴放在中间呢,而不是在左边? 即如何得到这种效果呢? 方法 ...
随机推荐
- python清理docker-harbor的多余镜像
# coding: utf-8 from operator import itemgetter from urllib import parse import requests import date ...
- Vue事件 定义方法执行方法 获取数据 改变数据 执行方法传值 以及事件对象
<template> <div id="app"> <!-- <img v-bind:src='url' /> <img :src= ...
- 设计input搜索框提示文字点击消失的效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- VMware虚拟机提示“锁定文件失败 打不开磁盘”解决方法
VMware虚拟机提示“锁定文件失败 打不开磁盘”解决方法 摘自: http://www.xitongcheng.com/jiaocheng/xtazjc_article_40299.html 发布时 ...
- Egret中图片颜色的改变,颜色矩阵
参考: 图片处理:颜色矩阵和坐标变换矩阵 Egret-滤镜 之前面试有问到如何改变图片的颜色.貌似之前做Flash的时候做过,做Egret后没有此类需求,所以一直没有研究过. 现在来弄一弄如何改变图片 ...
- java使用Sonic 算法对音频变速不变声、变调、调整音量
依赖库:https://github.com/waywardgeek/sonic 基础库:Sonic.java /* Sonic library Copyright 2010, 2011 Bill C ...
- LODOP指定window默认打印机和临时默认打印机
通过以下语句,可指定windows默认打印机LODOP.SET_PRINT_MODE("WINDOW_DEFPRINTER",某打印机名或序号);这种默认打印机是指的windows ...
- 图解 perspective && perspective-origin && transform3d && transform-origin
perspective && perspective-origin perspective是物体相对于画布的视距距离 perspective-origin是物体在画布位置的中心视点 t ...
- MySQL报错argument out of range 1055解决办法
参考:https://www.cnblogs.com/liangbenstudy/p/10246895.html MySQL 5.7.22查询时候报错 argument out of range 报错 ...
- TortoiseSVN安装和使用(转)
http://blog.csdn.net/Zhihua_W/article/details/64904692?locationNum=2&fps=1 https://www.cnblogs.c ...