Question

您好，我想在Highchart中绘制一条带有三行的图表。其中两个可以显示数据[4.12,3.34,5.45] / [3.45,5.45,3.23]中显示的结果，但第三行应该是没有任何逗号的visibe。 Resuls应该像[7,4,2]

代码：

$(function () {
  $('#container').highcharts({
    title: {
      text: '',
      x: -20 //center
    },
    colors: ['blue', 'red'],
    plotOptions: {
      line: {
        lineWidth: 3
      },
      tooltip: {
        hideDelay: 200
      }
    },
    subtitle: {
      text: '',
      x: -20
    },
       xAxis: {
        categories: [
            ''
        ]
    },
    yAxis: [{
        min: 0,
        title: {
            text: ''
        }
    }, {
        title: {
            text: ''
        },
        opposite: true
    }],
   tooltip: {
       pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y:.0f} h</b><br/>',

      valueSuffix: ' h',
      crosshairs: true,
      shared: true
      },

    legend: {
      layout: 'vertical',
      align: 'right',
      verticalAlign: 'middle',
      borderWidth: 1
    },
     plotOptions: {
                line: {
                    dataLabels: {
                        enabled: true,
                        formatter: function () {
                            return Highcharts.numberFormat(this.y,2);
                        }
                    },
                    enableMouseTracking: true
                }
            },
    series: [{
      name: '1',
      color: 'rgba(51, 204, 204, 0.75)',
      lineWidth: 2,
      data: [4.12,3.34,5.45]
    }, {
      name: '2',
      color: 'rgba(255, 77, 77,0.75)',
      marker: {
        radius: 6
      },
        data: [3.45,5.45,3.23]
    },{
      name: '3',
      color:'#bfbfbf',
      marker: {
        radius: 6
      },
        data: [7.34,4.23,1.78]
    }]
  });
});

http://jsfiddle.net/bmv5e8v7/3/ 你能帮忙吗？

Answer 1

除了@BarbaraLaird所写的内容之外，您还可以为一个系列定义数据标签的格式，如下所示：

dataLabels: {
    format: '{y:.0f}'
}

API参考：
http://api.highcharts.com/highcharts/plotOptions.series.dataLabels.format

例：
http://jsfiddle.net/ozvgfkj0/

Answer 2

您可以为dataLabels formatter函数添加条件：

    dataLabels: {
      enabled: true,
      formatter: function() {
        if (this.series.name == '3')
          return Highcharts.numberFormat(this.y, 0);
        else
          return Highcharts.numberFormat(this.y, 2);
      }
    },

http://jsfiddle.net/blaird/bmv5e8v7/4/

Highchart显示单个行没有逗号的结果

2 个答案: