当前位置: 首页 > news >正文

【echarts踩坑记录】为什么第二个Y轴最大值不整洁

目录

  • 问题复现示意图:
  • 解决方法有以下几种:
    • 1. 在y轴配置中手动设置max属性:
    • 2. 使用ECharts提供的坐标轴标签格式化功能:
  • 🚀写在最后

问题复现示意图:

在这里插入图片描述

今天在用echarts图表的时候,出现了一个小问题。第二个y轴上的最大值显示为1.799999而不是1.8,查阅了资料发现是因为JavaScript中的浮点数精度问题。

在ECharts图表中,当系统需要根据数据自动计算y轴的最大值时,如果数据中包含的最大值接近1.8,JavaScript的浮点数计算可能会产生微小的精度误差,导致最终显示为1.799999而不是精确的1.8。

这是因为JavaScript(和大多数编程语言)使用IEEE 754标准来表示浮点数,这种表示方式在某些十进制数值转换为二进制时会产生微小的舍入误差。

解决方法有以下几种:

1. 在y轴配置中手动设置max属性:

yAxis: [{// 第一个y轴配置},{type: 'value',name: this.yName2,max: 1.8, // 手动设置最大值// 其他配置...}
]

2. 使用ECharts提供的坐标轴标签格式化功能:

yAxis: [{// 第一个y轴配置},{type: 'value',name: this.yName2,axisLabel: {formatter: function(value) {// 对接近整数或特定小数的值进行格式化return parseFloat(value).toFixed(1);}},// 其他配置...}
]

这个问题是JavaScript浮点数计算的常见现象,不会影响图表的实际功能,只是显示上看起来不够整洁。通过上述方法可以使显示更加规范。

yAxis: [{// 第一个y轴配置},{type: 'value',name: this.yName2,max: 1.8, // 手动设置最大值// 其他配置...}
]
yAxis: [{// 第一个y轴配置},{type: 'value',name: this.yName2,axisLabel: {formatter: function(value) {// 对接近整数或特定小数的值进行格式化return parseFloat(value).toFixed(1);}},// 其他配置...}
]

🚀写在最后

希望我的分享能够帮助到更多的人,如果觉得我的分享有帮助的话,请大家一键三连支持一下哦~
❤️原创不易,期待你的关注与支持~
点赞👍+收藏⭐️+评论✍️
😊之后我会继续更新前端学习小知识,关注我不迷路~

http://www.dtcms.com/a/278107.html

相关文章:

  • Acrobat 表单中的下拉菜单(附示例下载)
  • 使用docker的常用命令
  • RS4585自动收发电路原理图讲解
  • 从 Manifest V2 升级到 Manifest V3 的注意事项
  • Extended Nested Arrays for Consecutive Virtual Aperture Enhancement
  • 财务管理体系——解读大型企业集团财务管理体系解决方案【附全文阅读】
  • Python异步编程
  • 57.第二阶段x64游戏实战-实时监控抓取lua内容
  • 利用低汇率国家苹果订阅,120 元开通 ChatGPT Plus
  • 14.使用GoogleNet/Inception网络进行Fashion-Mnist分类
  • docker基础部署
  • ID生成策略
  • 在新版本的微信开发者工具中使用npm包
  • 用信号量实现进程互斥,进程同步,进程前驱关系(操作系统os)
  • DOS下EXE文件的分析 <1>
  • MacBook Air通过VMware Fusion Pro安装Win11
  • 从代码学习深度强化学习 - DDPG PyTorch版
  • [Python 基础课程]列表
  • 【DataLoader的使用】
  • 力扣 hot100 Day43
  • Actor-Critic重要性采样原理
  • java valueOf方法
  • 【算法】贪心算法入门
  • SwiftUI 7 新 WebView:金蛇出洞,网页江湖换新天
  • 一些git命令
  • 若依框架集成阿里云OSS实现文件上传优化
  • 对于muduo我自己的理解
  • UniHttp生命周期钩子与公共参数实战:打造智能天气接口客户端
  • flask校园学科竞赛管理系统-计算机毕业设计源码12876
  • SPSSPRO:数据分析市场SaaS挑战者的战略分析