ECharts 学习笔记 - x/y轴 强制显示最小值、最大值_echarts折线图横坐标数字最大显示数量_笑虾的博客-程序员宅基地

技术标签: 图表  最小值  强制显示    最大值  Charts  

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)。

开启前

在这里插入图片描述

开启后

在这里插入图片描述

例子

(打开链接,代码复制过去运行即可)
https://echarts.apache.org/v4/examples/zh/editor.html?c=line-simple

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'
    }]
};

参考资料

xAxis.axisLabel. showMinLabel
xAxis.axisLabel. showMaxLabel

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/jx520/article/details/114001270

智能推荐

Oracle 数据库12c安装示例db-sample-schemas(pdb下安装)_运维自动化&云计算的博客-程序员宅基地

参考官方文档:https://docs.oracle.com/en/database/oracle/oracle-database/12.2/comsc/installing-sample-schemas.html#GUID-4D4984DD-A5F7-4080-A6F8-6306DA88E9FCgithub下载地址:https://github.com/oracle/db-sample-sc...

Python 协议攻击脚本(六): STP攻击_stp-dos_酉酉囧的博客-程序员宅基地

文章目录STP数据包抓包STP欺骗STP Dos编写脚本STP欺骗STP Dos完整代码STP生成树协议(英语:Spanning Tree Protocol,STP),是一种工作在OSI网络模型中的第二层(数据链路层)的通信协议,基本应用是防止交换机冗余链路产生的环路.用于确保以太网中无环路的逻辑拓扑结构.从而避免了广播风暴,大量占用交换机的资源.STP的工作过程如下:首先进行根网桥..._stp-dos

编译原理 第五章 (自顶向下分析,first、follow、select、LL(1)、消除左递归、左公因子)_自顶向下分析:ll(1) 修改文法:消除左递归,提左公因子 计算first集及follow集 构建_托马斯大火车的博客-程序员宅基地

自顶向下分析文章目录(1).确定分析的条件1.定义:2.例子:(2).开始符号集FIRST(α)2.例子:(重要!!!)(3).后跟符号集FOLLOW(A)2.例子:(重要!!!)(4).选择集合SELECT(A->α)1.定义(重要的公式!!):2.例子:(重要!!!)(5)LL(1)文法1.定义:2.LL(1)的含义(重要!!!!重要!!!!)(1).确定分析的条件1.定义:从文法的开始符出发,如能根据当前输入符号(单词符号)唯一地确定选用哪个产生式进行推导,则分析是确定的。2.例子:_自顶向下分析:ll(1) 修改文法:消除左递归,提左公因子 计算first集及follow集 构建

pyqt5打包成exe 及 ...because it could not find or load the Qt platform plugin "windows"...问题解决_lsh呵呵的博客-程序员宅基地

打包安装pyinstaller。pip install pyinstaller命令行执行如下命令,main.py为应用主程序,-F输出为单文件。(注意pycharm写代码时包的导入和外部程序的导入方式不同,可先使用命令行测试。)pyinstaller -F -w main.pyplugin “windows”问题pyqt打包完成后,运行出错: This app...

echarts动态添加数据_Feng┗( ▔, ▔ )┛的博客-程序员宅基地

Html+echarts动态获取数据创建echarts模型动态获取数据后台数据格式创建echarts模型// 创建一个存放模型的div,并初始化模型<div id="Map-cal-bar" style="width:100%;height:400px;float: left;"></div>//条线图 <script type="text/javascript"> var barInstantiation = echarts.init(document.ge_echarts动态添加数据

使用 Mathpix Snipping 和 MathType 快速输入公式_zzsugar的博客-程序员宅基地

使用 Mathpix Snipping 和 MathType 快速输入公式​ Mathpix 是一个漂亮的小工具,它允许你截取复杂数学方程式的截图,并立即将其转换为 LaTeX 可编辑文本。亲测化学公式也可识别~​ Mathpix 下载地址:https://pan.baidu.com/s/1TwSs8JjNeenkc0kKJIVq4w 提取码:15zy​ ...

随便推点

第一次参加CCF心得_ccf和acm哪个难_夜流歌的博客-程序员宅基地

笔者今年是一个大三的本科生,准备考研。后来看见班里人都在讨论ACM和CCF,对于CCF一无所知的我就去了解了一下。当我百度了一下后发现“呀,这个CCF的国内认可度蛮高的嘛”。看到好多学校和公司都有一些关于CCF的要求。于是在我啥也不知道的女朋友的鼓励下,我决定,报考CCF!去官网了解了一下后发现以学生的身份报考可以用便宜70元(50元会员费与180报考费,一共230元),对于我这个只参加过四六级..._ccf和acm哪个难

向量的内积(点积)、叉积(向量积)_a×b向量积的几何意义_MAR-Sky的博客-程序员宅基地

点乘、数量积、内积向量的点乘即数量积,记作a·b;其中a·b=|a|·|b|cosθ,|a|、|b|是两向量的模,θ是两向量之间的夹角(0≤θ≤π).以上a与b均为向量,点乘,也叫向量的内积、数量积。几何意义:一个向量长度和它在另一个向量投影长度的乘积。叉乘、向量积叉乘是向量积,记作a×b,a×b=|a|·|b|sinθ,其中|a|、|b|是两向量的模,θ是两向量之间的夹角(0≤θ≤π).以上a与b均为向量。|向量c|=|向量a×向量b|=|a||b|sin<a,b>向量c的方向与a_a×b向量积的几何意义

vue的v-for循环指令_v-for 100_dongsdh的博客-程序员宅基地

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;script src="js/vue.js"&gt;&lt;/script&gt; &lt;title&gt;&lt;/title&a_v-for 100

CI框架获取post和get参数_最强的法师的博客-程序员宅基地

$this->input->post() $this->input->get()本文主要介绍在CodeIgniter框架中如何获取get和post参数。 获取get数据 在PHP主流的框架中,CI中url的pathinfo传递参数是一个特殊情况,它没有使用传统pathinfo的‘c/m/key/value‘ 这种模式,而是在URI类中封装了segment这个方法,假设uri为/index.p

关于tomcat启动日志的选择性打印和禁止打印的问题_tomcat不打印命令行参数_Sherlock?a的博客-程序员宅基地

tomcat每次启动时,自动在logs目录下生产以下日志文件,按照日期自动备份localhost.2016-07-05.txt //经常用到的文件之一 ,程序异常没有被捕获的时候抛出的地方catalina.2016-07-05.txt //经常用到的文件之一,程序的输出,tomcat的日志输出等等manager.2016-07-05.txt //估计是manager项目专有的hos_tomcat不打印命令行参数

在Windows7环境下安装MySQL5.5_mysql5.5需要win7环境_If2018的博客-程序员宅基地

在Windows7环境下安装MySQL5.5的步骤1、下载MySQL安装文件(.msi文件),并双击安装文件进行安装,此时会弹出MySQL的安装向导界面,并单击next按钮;2、此时,会显示用户许可协议,选择接受,然后单击next按钮;3、进入界面,选择安装类型,这里选择Custom(定制安装),会跳出安装界面;4、选择要安装的组件,修改安装目录,然后点击next按钮,..._mysql5.5需要win7环境

推荐文章

热门文章

相关标签