Hightchart对数值进行格式化

最新推荐文章于 2025-06-03 09:05:59 发布

bibirun

最新推荐文章于 2025-06-03 09:05:59 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript web

本文链接：https://blog.youkuaiyun.com/huangbiubiu/article/details/78133571

web 同时被 2 个专栏收录

2 篇文章

订阅专栏

javascript

1 篇文章

订阅专栏

本文解决Highcharts泡图中数值显示不统一的问题，探讨如何利用Highcharts内置的numberFormat函数来统一显示格式，包括小数点位数、千分号等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用hightchart制作泡图的时候显示的数据格式不统一，有一些按给定的数值进行显示，但是有些却显示了很多位。我开始怀疑是后台的代码没有对数值进行格式化造成的。就去查看了后台代码，结果与我预判的正好相反。我又开始打印了了传给highchart的数据，显示数据与预期符合。既然后台的数值没问题，那么接下来肯定就是hightchart的显示出问题了。幸好网络上有多关于hightchart数值格式化的答案。毫无疑问，肯定是查看highchart的API。

numberFormat (Number number, [Number decimals], [String decimalPoint], [String thousandsSep])
针对 JavaScript 数值进行格式化的函数，例如千分号处理、小数点位数等。该属性和 See PHP 的数值格式化函数（number_format） 是一样的（一样的参数及处理方式），详细请参考 这个帖子

参数

number: Number
需要格式化的数值
decimals: Number
小数点保留位数
decimalPoint: String
小数点符号，默认是 "." 或者是在 全局语言配置 参数中指定的字符串。
thousandsSep: String
千分号。默认是 " " 或在 全局语言配置 参数中指定的字符串。
返回值

String


formatter: function() { 
	return this.point.name + Highcharts.numberFormat(this.percentage,2) + '%';
}

API链接地址 https://api.hcharts.cn/highcharts#Highcharts.numberFormat