Highcharts数字格式化

数字格式化函数：Highcharts.numberFormat()

摘要: Highcharts.numberFormat()用于图表中数值的格式化，常见用途有数值精度控制、小数点符、千位符显示控制等。例如 Highcharts.numberFormat(12223.87, 2) = 12223.87 （保留两位小数） ... ... ...

一、函数说明 该函数用于图表中数值的格式化，常见用途有数值 精度控制、小数点符、千位符显示控制等。 二、函数使用 1、函数构造及参数 Highcharts. numberFormat (Number number, [Number decimals], [String decimalPoint], [String thousandsSep])         参数列表 number  需要格式化的数字 decimals 小数保留位数，最后一位是四舍五入，默认为 0（可选参数） decimalPoint  小数点符，默认是“.”（可选参数） thousandsSep千位符，默认是“,” （可选参数） 返回值类型：String 详见API 文档 ：  http://www.hcharts.cn/api/index.php#Highcharts.numberFormat   2、举个栗子 对于数字 12223.8723 Highcharts.numberFormat( 12223.87)   =  12,224     （默认精度是0） Highcharts.numberFormat( 12223.87, 2)  =  12223.87  （保留两位小数） Highcharts.numberFormat( 12223.87, 2, ",", " ")   =  12 223,87  （小数点用“,”，千分符用“ ”） Highcharts.numberFormat( 12223.87, 2, ".", "")    =  12223.87   （不显示千分符） 三、操作实例 饼图的数据及dataLabels 的格式化函数如下 plotOptions: { pie: { dataLabels: { enabled: true, formatter: function() { return this.point.name + this.percentage + '%'; } } } }, series: [{ type: 'pie', name: 'Browser share', data: [ ['Firefox', 45.60], ['IE', 26.68], { name: 'Chrome', y: 12.68, sliced: true, selected: true }, ['Safari', 8.65], ['Opera', 6.62], ['Others', 0.67] ] }] 这时候我们看到的饼图文字标签（dataLabels）为 图中的数字（dataLabels中的饼图扇区所占百分比）就会显示出没有经过精度控制的内容，利用Highcharts. numberFormat() 我们就可以控制该数值的精度。 formatter: function() { return this.point.name + Highcharts.numberFormat(this.percentage,2) + '%'; }     至此已基本说清楚 Highcharts.numberFormat() 函数的作用了，下面说下关于该函数更多用处及数字格式化相关内容。 四、相关内容 1、需要用到数值格式化函数的地方 在图表中有很多地方也有可能需要用到数值格式化函数，归纳如下 坐标轴文字（Axis.labels）：对应的格式化函数是 xAxis.labels.formatter、yAxis.labels.formatter 数据提示框（tooltip）：对应的格式化函数是 tooltip.formatter 数据点文字（dataLabels）：plotOptions.series.dataLabels.formatter 及  plotOptions.{chartType}.dataLabels.formatter 2、用于数值格式化的其他方法        同样是格式化，Highcharts还提供了更简便的方法，也就是 format 字符串 ， 例如与  plotOptions.series.dataLabels.formatter 对应的就是  plotOptions.pie.dataLabels.format           示例代码   plotOptions: { pie: { dataLabels: { enabled: true, formatter: function() { return this.point.name + this.percentage + '%'; }, // 对应的format format:"{point.name} + {percentage}"; } } },   也就是 formatter 是函数，format 是格式字符串，关于两者的区别及优点这里就不多说，我们来说说format是如何进行数值精度控制的。    formatter: function() {       return this.point.name   + Highcharts.numberFormat(this.percentage,2) + '%';  }  format:"{point.name} {this.percentage:.2f}"    {this.percentage:.2f}  即 {数值:.精度f}