一、函数说明

该函数用于图表中数值的格式化,常见用途有数值精度控制、小数点符、千位符显示控制等。
 
二、函数使用
 
1、函数构造及参数
Highcharts.numberFormat (Number number, [Number decimals], [String decimalPoint], [String thousandsSep])
 
        参数列表
  • number   需要格式化的数字
  • decimals  小数保留位数,最后一位是四舍五入,默认为 0(可选参数)
  • decimalPoint   小数点符,默认是“.”(可选参数)
  • thousandsSep 千位符,默认是“,” (可选参数)
返回值类型:String
 
 
  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、需要用到数值格式化函数的地方
在图表中有很多地方也有可能需要用到数值格式化函数,归纳如下
 
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}
 
 
转自:http://bbs.hcharts.cn/article-54-1.html

(转)数字格式化函数:Highcharts.numberFormat()的更多相关文章

  1. 数字格式化函数:Highcharts.numberFormat()

    (转)数字格式化函数:Highcharts.numberFormat() 一.函数说明 该函数用于图表中数值的格式化,常见用途有数值精度控制.小数点符.千位符显示控制等.   二.函数使用   1.函 ...

  2. 5个缺失的 JavaScript 数字格式化函数

    /** 下面两个函数都能对浮点数进行四舍五入,保留小数点后两位 **/ function CurrencyFormatted(amount) { var i = parseFloat(amount); ...

  3. freemarker 数字格式化函数

    ${num?string('0.00')} 如果小数点后不足两位,用 0 代替 ${num?string('#.##')} 如果小数点后多余两位,就只保留两位,否则输出实际值 输出为:1239765. ...

  4. php课程 6-22 字符串格式化函数有哪些(精问)

    php课程 6-22 字符串格式化函数有哪些(精问) 一.总结 一句话总结: 1.猜测一下$_GET()怎么来的? 函数赋值给变量的操作:$_YZM=get();   这样就可以很好的解释哪些全局变量 ...

  5. php实现数字格式化,数字每三位加逗号的功能函数

    原地址:http://www.jb51.net/article/73781.htm php实现数字格式化,数字每三位加逗号的功能函数,具体代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 ...

  6. Java SE基础部分——常用类库之NumberFormat(数字格式化)

    数字格式化常用方法:DecimalFormat和NuberFormat. //2016060524 数字格式化学习 //数字格式化 两种方法 一种直接使用NumberFormat,另一种Decimal ...

  7. 自定义编写js格式化数字的函数

    在处理网页的时候,有时候会需要显示很长的数字,但是当数字的长度比较长的时候,就很难看一个数字到底是多大.这种情况下,一些网站在处理数字的时候,当数字的长度大于3个时,就用逗号把他们分开,这是一个比较常 ...

  8. JavaScript 系列--JavaScript一些奇淫技巧的实现方法(二)数字格式化 1234567890转1,234,567,890;argruments 对象(类数组)转换成数组

    一.前言 之前写了一篇文章:JavaScript 系列--JavaScript一些奇淫技巧的实现方法(一)简短的sleep函数,获取时间戳 https://www.mwcxs.top/page/746 ...

  9. jquery EasyUI的formatter格式化函数代码

    要格式化数据表格列,需要设置formatter属性,该属性是一个函数,它包含两个参数:  value: 对应字段的当前列的值  record: 当前行的记录数据  复制代码 代码如下: $('#tt' ...

随机推荐

  1. requireJS 用法

    requireJS使用教程 2.0 常用方法 requirejs.config : 为模块指定别名 requirejs : 将写好的模块进行引入,根据模块编写主代码 define : 编写模块 htm ...

  2. 数据库知识整理<七>

    组合查询: 7.1使用子查询: 嵌套在其他查询中的查询,我们称之为子查询.子查询本身也可能包含一个子查询.子查询也称为内部查询,而包含子查询的语句也称为外部查询. 所有的子查询可以被分为两个类别:子查 ...

  3. elixir 高可用系列(一) Agent

    概述 elixir 本身是一种 immutable 的语言,默认情况下,进程间是不共享任何状态的,进程之间通过消息来交互. 而 Agent 则封装了一种进程间共享状态的方式,通过这种方式,不用显式的写 ...

  4. 手机数据抓包以及wireshark技巧

    本文主要讨论一种非常方便的抓取Android和iphone手机网络数据包的办法,以及介绍wireshark最常用的技巧 抓包工具介绍 (1).网页抓包工具 Chrome浏览器插件 FireBug 插件 ...

  5. 设计模式之美:Flyweight(享元)

    索引 意图 结构 参与者 适用性 效果 相关模式 实现 实现方式(一):使用 FlyweightFactory 管理 Flyweight 对象. 意图 运用共享技术有效地支持大量细粒度的对象. Use ...

  6. AlwaysOn--查看可用性组的首先备份节点

    在Alwayson中,可以通过设置来将备份放到指定的节点上完成,微软提供了函数用来判断当前指定节点进行备份: ) SET @database_name= 'DB5' SELECT CASE [mast ...

  7. webApp 阅读器项目实践

    这是一个webApp 阅读器的项目,是慕课网的老师讲授的一个实战,先给出项目源码在GitHub的地址:https://github.com/yulifromchina/MobileWebReader. ...

  8. 浅谈压缩感知(二十七):压缩感知重构算法之稀疏度自适应匹配追踪(SAMP)

    主要内容: SAMP的算法流程 SAMP的MATLAB实现 一维信号的实验与结果 稀疏度K与重构成功概率关系的实验与结果 一.SAMP的算法流程 前面所述大部分OMP及其前改算法都需要已知信号的稀疏度 ...

  9. H5常用代码:适配方案1

    在工作中接到H5项目,第一件想到的事就应该是屏幕适配问题,解决了屏幕适配,接下来的事才能真正开始.从此篇博客开始会连续记录下我经常用到的一些适配方案. 对于传统的PC项目,直接在移动端打开也都是会以视 ...

  10. .NET Remoting学习笔记(三)信道

    目录 .NET Remoting学习笔记(一)概念 .NET Remoting学习笔记(二)激活方式 .NET Remoting学习笔记(三)信道 参考:♂风车车.Net .NET Framework ...