echarts柱状图x轴数据隔一个显示

 
在显示一个柱状图的时候,x轴的数据是隔一个显示的,但是hover的时候却能显示出当前轴x轴的名称,如下图:
那就只能说明这个轴的名称太长了,所以导致它默认就隔一个显示,找了半天才发现控制它的属性是
axisLabel
xAxis : [
{
type : 'category',
data : ["周一", "周二", "周三", "周四", "周五", "周六", "周天"],
axisTick: {
alignWithLabel: true
},
axisLabel: {
interval:0
}
}
],
该属性设置成0则表示强制显示所有标签,设置为1的话,隔一个标签显示一个标签,以此类推。
但是设置为0的话,如果数据再长点,它会把这个数据直接不显示,还是没有解决问题,后来发现,可以让这个数据倾斜,那么就不会有不显示的问题了,
axisLabel: {
interval:0,
rotate:45, //代表逆时针旋转45度
}
 
 
 
 

解决 echarts柱状图x轴数据隔一个显示的更多相关文章

  1. Highcharts属性与Y轴数据值刻度显示Y轴最小最大值

    Highcharts 官网:https://www.hcharts.cn/demo/highcharts Highcharts API文档:https://api.hcharts.cn/highcha ...

  2. echarts使用记录(三):x/y轴数据和刻度显示及坐标中网格显示、格式化x/y轴数据

    1.去掉坐标轴刻度线,刻度数据,坐标轴网格,以Y轴为例,同理X轴 xAxis: [{ type: 'category', axisTick: {//决定是否显示坐标刻度 alignWithLabel: ...

  3. 解决echarts中X轴文字过长的问题。【转】

    axisLabel: { interval: , formatter:function(value) { debugger var ret = "";//拼接加\n返回的类目项 ; ...

  4. ucharts的区域图、折线图(有x轴的),修改x轴显示为隔一个显示

    1.原本的显示方式: 2.想要的效果: 3.这边我使用的是uchart的组件,在uni_modules > qiun-data-charts > js_sdk > u-charts, ...

  5. Echarts【1、数据过多导致显示不全分页,2、数据展示探讨分析】

    var len=<c:out value="${len }"></c:out>; var dataZoom_end=null; //为空默认100%所以默认 ...

  6. 【前端图表】echarts散点图鼠标划过散点显示信息

    在做项目的过程中,总会遇到这样或者那样的bug,这个时候就要看自己的动手能力有多强了,着手解决了一个bug之后,整个人都感觉很开心,端午下班之前遇到了一个小问题,echarts散点图鼠标划过散点的时候 ...

  7. echarts柱形图x轴显示不全或者每隔一个不显示的问题

    问题原因可能:x轴数据间隔太小: 问题解决: 1.调整间隔属性 xAxis: { type: 'category', //坐标轴斜着显示 axisLabel: { interval:0, rotate ...

  8. ECharts 柱状图横轴(X轴)文字内容显示不全

    1.问题描述 ECharts在限制显示区域大小或者数据内容过多的时候有时会使得柱状图横轴(X轴)显示不全的问题,效果如下图所示. 2.解决办法 1)更改grid布局 原来布局 option = { g ...

  9. Echarts使用及动态加载图表数据 折线图X轴数据动态加载

    Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...

  10. echarts柱状图坐标文字显示不完整解决方式

    echarts柱状图坐标文字显示不完整解决方式 本文转载自:https://jingyan.baidu.com/article/ab69b2707a9aeb2ca7189f0c.html echart ...

随机推荐

  1. Go语言核心知识回顾(接口、Context、协程)

    温故而知新 接口 接口是一种共享边界,计算机系统的各个独立组件可以在这个共享边界上交换信息,在面向对象的编程语言,接口指的是相互独立的两个对象之间的交流方式,接口有如下好处: 隐藏细节: 对对象进行必 ...

  2. c/c++快乐算法第三天

    c/c++感受算法快乐(3) 开始时间2023-04-16 22:21:10 结束时间2023-04-17 00:09:34 前言:很好,这周就要结束了,大家都回学校了么,嘻嘻.回顾一下昨天的算法题, ...

  3. Analysis of Variance 方差分析

    title: "Analysis of Variance" author: '01' date: "2022-11-23" output: html_docum ...

  4. PowerBI(一) : 如何将powerBI报表嵌入内部web应用程序?

    最近做了一个PowerBI报表嵌入内部web应用系统的项目,分享一下主要步骤以及踩坑记录. 微软官网完整教程这里:https://learn.microsoft.com/zh-cn/power-bi/ ...

  5. JUC中常见的集合

    Map: HashMap ===> ConcurrentHashMap List: ArrayList ===> CopyOnWriteArrayList Set: HashSet === ...

  6. node使用react项目启动错误TSError: ⨯ Unable to compile TypeScript:

    1.错误内容 return new TSError(diagnosticText, diagnosticCodes) ^ TSError: ⨯ Unable to compile TypeScript ...

  7. Python 列表定义

    列表定义 由一系列按特定排序排列的元素组成,各元素之间无任何关系 用方括号[]来表示列表,并用逗号分隔其中的元素 访问列表元素 列表是有序集合,访问列表元素时,只需将该元素的位置或索引告知python ...

  8. 2021-02-06:假设字符串str长度为N,请问最长回文子串的长度是多少?

    福哥答案2021-02-06: 1.动态规划.无代码,见图.2.中心扩展法.无代码.3.Manacher算法.有代码,见图.1)理解回文半径数组.2)理解所有中心的回文最右边界R,和取得R时的中心点C ...

  9. 2022-04-21:给定一个包含 [0,n) 中不重复整数的黑名单 blacklist, 写一个函数从 [0, n) 中返回一个不在 blacklist 中的随机整数, 对它进行优化使其尽量少调用系

    2022-04-21:给定一个包含 [0,n) 中不重复整数的黑名单 blacklist, 写一个函数从 [0, n) 中返回一个不在 blacklist 中的随机整数, 对它进行优化使其尽量少调用系 ...

  10. 2021-03-30:给定一个整数组成的无序数组arr,值可能正、可能负、可能0。给定一个整数值K,找到arr的所有子数组里,哪个子数组的累加和<=K,并且是长度最大的。返回其长度。

    2021-03-30:给定一个整数组成的无序数组arr,值可能正.可能负.可能0.给定一个整数值K,找到arr的所有子数组里,哪个子数组的累加和<=K,并且是长度最大的.返回其长度. 福大大 答 ...