echarts 折线图 数据点过密,显示重叠该如何解决

echarts 折线图 数据点过密,显示重叠该如何解决

有这样一个图表,显示的数据比较多, 当把 label 显示出来的时候,这些 label 重叠了,我想让它间隔一下。

结果是这样的:

只需要在 label.formatter 上处理

具体的官方文档是: https://echarts.apache.org/zh/option.html#series-line.label.formatter

js 复制代码
label: {
	position: 'top',
	distance: 5,
	show: true,
	fontSize: 10,
	// 添加以下内容即可,这样的意思是每隔5个可视的点显示数值,而不是实际的数据点间隔
	formatter: (data) => {
	    if (data.dataIndex % 5 === 0){
	        return data.data.value
	    } else {
	        return ''
	    }
	}
},
相关推荐
sxmas9 分钟前
用状态机与DAG建模四阶段业务流程:以MIND模型为例
前端
八角丶1 小时前
Node 网络编程 —— TLS 模块
javascript·后端·node.js
倔强的石头1061 小时前
【Linux指南】动静态库系列(七):符号表与重定位:链接器如何把函数调用接起来
linux·前端·javascript
图扑软件2 小时前
中篇・运笔|统一 DataModel 底座,HT UI 组件万物同源
javascript·低代码·ui·性能优化·数据可视化
a1117762 小时前
3D 脑图谱 / Bilingual 3D Brain Atlas 项目
前端
T1mzhou2 小时前
ARM64 Linux 6.10内核启动流程2-rootfs 怎么挂上
linux·服务器·前端
小小尚@3 小时前
WebGIS/ECharts 地图开发|MapLand 在线行政区划边界一键下载 GeoJSON 工具
前端·javascript·echarts
葡萄城技术团队3 小时前
工业数据可视化:使用活字格 AIcoding + Three.js 构建轻量化三维设备监控大屏
开发语言·javascript·信息可视化
默_笙4 小时前
🚍 一条 Todo 的奇幻漂流:TypeScript 全栈类型安全的"护照检查"
前端·javascript
计算机魔术师4 小时前
NVIDIA 以 129.3 亿美元收购 Hugging Face
前端