ECharts 学习笔记 - x/y轴 强制显示最小值、最大值
发布日期:2021-06-30 14:53:51 浏览次数:2 分类:技术文章

本文共 1040 字,大约阅读时间需要 3 分钟。

ECharts 学习笔记 - x/y轴 强制显示最小值、最大值

当数轴上刻度过多无法全部显示时,需要隐藏一部分。
默认由系统自动判定,这时最大小最值就不一定会显示出来。(即如果标签重叠,不会显示)

关键在于这两个属性 showMinLabelshowMaxLabel

xAxis.axisLabel. showMinLabel

boolean
是否显示最小 tick 的 label。可取值 true, false, null。默认自动判定(即如果标签重叠,不会显示最小 tick 的 label)。

xAxis.axisLabel. showMaxLabel

boolean
是否显示最大 tick 的 label。可取值 true, false, null。默认自动判定(即如果标签重叠,不会显示最大 tick 的 label)。

开启前

在这里插入图片描述

开启后

在这里插入图片描述

例子

(打开链接,代码复制过去运行即可)

function shuffle(arr) {
var len = arr.length; for (var i = 0; i < len - 1; i++) {
var index = parseInt(Math.random() * (len - i)); var temp = arr[index]; arr[index] = arr[len - i - 1]; arr[len - i - 1] = temp; } return arr;}var len = 999;var xdata =Array.from({
length:len}, (v, k) => k+1);var ydata =shuffle(xdata.slice(0));option = {
xAxis: {
data: xdata, axisLabel: {
showMinLabel: true, // 强制显示最小值标签 showMaxLabel: true, // 强制显示最大值标签 },}, yAxis: {
type: 'value' }, series: [{
data: ydata, type: 'line' }]};

参考资料

转载地址:https://jerryjin.blog.csdn.net/article/details/114001270 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:IntelliJ IDEA 记学习笔 - Git历史版本切换
下一篇:Vue 学习笔记 - 若依前后端分离项目发布到子目录

发表评论

最新留言

路过,博主的博客真漂亮。。
[***.116.15.85]2024年04月06日 14时36分55秒