使用Echarts写出一个漂亮的柱状图
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了使用Echarts写出一个漂亮的柱状图相关的知识,希望对你有一定的参考价值。
参考技术A 这里卿洋愿喜❤️
echarts 柱状图由于数据太多导致数组柱重叠
参考技术A 使用echarts 柱状图 犹豫x轴上的数据太多,导致柱状图叠在一起我的解决办法是
X=x轴上的数据组
var namenum=Math.floor(100/(X.length/5)); // 这个5 可以顺便调整 是用来判断当前视图要显示几个
if (X.length>6) // 6也可以调整 用来判断是否显示滚动条
var showEchart=true;
else
var showEchart=false;
,
dataZoom: [ // 这是滚动条
show: showEchart, // 是否展示
xAxisIndex: [0], // 控制第一个x轴
height: 15,
left: 100,
right: 100,
bottom: 0,
start: 0, // 数据窗口范围的起始百分比。范围是:0 ~ 100。表示 0% ~ 100%。
end: namenum, // 数据窗口范围的结束百分比。范围是:0 ~ 100。
handleSize: "110%",
zoomLock: true, //是否锁定选择区域(或叫做数据窗口)的大小。如果设置为 true
,
]
改过之后
可以进行滚动条操作当前数据
以上是关于使用Echarts写出一个漂亮的柱状图的主要内容,如果未能解决你的问题,请参考以下文章