简体   繁体   English

Highcharts舍入yaxis和xaxis数字

[英]Highcharts rounding yaxis and xaxis digits

I am trying to round yaxis and xaxis down. 我正在尝试将yaxis和xaxis向下舍入。 For example 3843 should be 3.843 on the graph and tooltip show 3.843 k. 例如,图形上的3843应该是3.843,工具提示显示3.843 k。

I have got the tooltip working but cant get it to change the graphs yaxis and xaxis value so that the graph can show all sides fully. 我已经使用了工具提示,但是无法更改图形的yaxis和xaxis值,因此该图形可以完全显示所有侧面。

As you can see here: http://jsfiddle.net/kzL0phfu/ 如您所见: http : //jsfiddle.net/kzL0phfu/

This is what xaxis looks like 这就是xaxis的样子

yAxis: {
gridLineInterpolation: 'polygon',
lineWidth: 0,
min: 0,
gridLineColor: "#808080",
gridLineDashStyle: "Solid",
gridLineWidth: 2,
labels: {
  format: '{value:.2f}',
  style: {
    color: '#c4c4c4',
    font: '11px Trebuchet MS, Verdana, sans-serif'
  }
}
}

Use dataLabels formatter to achieve desired result 使用dataLabels formatter获得所需的结果

  plotOptions: {
    area: {
      dataLabels: {
        useHTML: true,
        enabled: true,
        formatter: function() {
          value = this.y;
          numericSymbolDetector = Math.abs(this.y);
          if (numericSymbolDetector > 1000) {
            value = Highcharts.numberFormat(value / 1000, 3, '.', '') ;
          }
          return value
        },
        style: {
          color: '#c4c4c4',
          font: '5px Trebuchet MS, Verdana, sans-serif'
        }
      },
      //enableMouseTracking: false
    },
    series: {
      lineColor: '#808080'
    }
  },

Fiddle demonstration 小提琴示范

If you want to display yAxis labels the same way, get rid of the formatter from the yAxis.labels object (then the thousand prefix will display). 如果要以相同方式显示yAxis标签,请从yAxis.labels对象中删除格式化程序(然后将显示千位前缀)。 In case you want to display exact values of the points as yAxis labels, you can update tickPositions array on load event and format them adequately. 如果您想将点的精确值显示为yAxis标签,则可以在加载事件时更新tickPositions数组并对其进行适当的格式化。 Take a look at the example below. 看下面的例子。

API Reference: API参考:
http://api.highcharts.com/highcharts/chart.events.load http://api.highcharts.com/highcharts/yAxis.tickPositions http://api.highcharts.com/highcharts/chart.events.load http://api.highcharts.com/highcharts/yAxis.tickPositions

Example: 例:
http://jsfiddle.net/ojno8rx1/ http://jsfiddle.net/ojno8rx1/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM