图表中的文字及语言相关的内容都是可以自定义及本地化的，下面详细说明。

一、语言及文字

Highcharts 中的文字可以通过 Highcharts.setOptions.lang 来设定，lang 属于全局配置，对当前页面的所有图表有效，对应的汉化后的配置是：

  1. // 全局配置，对当前页面的所有图表有效
  3. Highcharts.setOptions({
  4.     lang:{
  5.        contextButtonTitle:"图表导出菜单",
  6.        decimalPoint:".",
  7.        downloadJPEG:"下载JPEG图片",
  8.        downloadPDF:"下载PDF文件",
  9.        downloadPNG:"下载PNG文件",
  10.        downloadSVG:"下载SVG文件",
  11.        drillUpText:"返回 {series.name}",
  12.        loading:"加载中",
  13.        months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
  14.        noData:"没有数据",
  15.        numericSymbols: [ "千" , "兆" , "G" , "T" , "P" , "E"],
  16.        printChart:"打印图表",
  17.        resetZoom:"恢复缩放",
  18.        resetZoomTitle:"恢复图表",
  19.        shortMonths: [ "Jan" , "Feb" , "Mar" , "Apr" , "May" , "Jun" , "Jul" , "Aug" , "Sep" , "Oct" , "Nov" , "Dec"],
  20.        thousandsSep:",",
  21.        weekdays: ["星期一", "星期二", "星期三", "星期四", "星期五", "星期六","星期天"]
  22.     }
  23. });

在线试一试

二、时间及时区

1、时间格式化

Highcharts 不同位置的时间显示可以通过对应时间格式化函数 Highcharts.dateFormat 来处理，例如处理数据提示框中的时间显示可以通过下面的方法实现：

  1. tooltip: {
  2.     dateTimeLabelFormats: {
  3.         year:"%Y",
  4.         second:"%Y-%m-%d %H:%M:%S",
  5.         // ...
  6.     },
  7.     // 还可以在 格式化函数中通过调用  Highcharts.dateFormat() 函数来处理，总之是非常灵活的
  8. }

对于 x轴的时间格式化可以通过下面的方式实现：

  1. xAxis: {
  2.     dateTimeLabelFormats: {
  3.         year: '%Y',
  4.         month: '%Y-%m',
  5.         dat: '%Y-%m-%d',
  6.         // ...
  7.         // 当然还可以通过xAxis.labels.formatter 函数来格式化
  8.     }
  9. }

在线试一试

对于其它地方需要进行日期格式化这里不再累述。

2、时区

通过 global.timezoneOffset 可以设置时区，中国属于 +8 区，所以有的时候图表中显示的时间和实际时间相差 8 个小时，这时候我们可以通过设置时区来修正，配置代码如下：

  1. Highcharts.setOptions({
  2.     global: {
  3.         timezoneOffset: -8 * 60  // +8 时区修正方法
  4.     }
  5. })

三、符号

图表中数值显示时往往带有格式化符号，这里统一说明如下：

1、小数点、千分号、公制前缀

  1. Highcharts.setOptions({
  2.   lang: {
  3.     decimalPoint: '.', // 小数点号，例如 12.50
  4.     thousandsSep: ',' // 千分号，例如 12,000
  5.     numericSymbols: 'k,M,G,T,P,E' // 公制前缀，通过设置为 null 不显示 12k，1.2M 这种形式
  6.   }
  7. })

2、数值格式化函数

通过 Highcharts.numberFormat 可以对图表中的数值进行格式化，函数说明如下

函数构造

  1. Highcharts.numberFormat (Number number, [Number decimals], [String decimalPoint], [String thousandsSep])

参数说明：

  • number 需要格式化的数值
  • decimals 精度，保留位置，可选参数，默认是 0
  • decimalPoint 小数符号，可选参数，默认是 global.decimalPoint
  • thousandsSep 千分符，可选参数，默认是 global.numericSymbols
    点击查看详情

原文: https://www.hcharts.cn/docs/basic-lang