4

我正在尝试在 Highcharts 的条形图中放置一个标签。在我的情况下，您可以在此处看到的每个栏上方：

$(function () {
  var chart;
  $(document).ready(function() {
    chart = new Highcharts.Chart({

        chart: {
            renderTo: 'container',
            type: 'column'
        },

        title: {
            text: 'Indicator per Sex'
        },

        xAxis: {
           categories: [
                'Jan',
                'Fev',
                'Mar',
                'Apr',
                'May',
               'Jun',
               'Jul',
               'Aug',
               'Sep',
               'Oct',
               'Nov',
               'Dez'
           ]
        },

        yAxis: {
            allowDecimals: false,
            min: 0,
            title: {
                text: 'Consults'
            }
        },

        tooltip: {
            formatter: function() {
                return '<b>'+ this.x +'</b><br/>'+
                    this.series.name +': '+ this.y +'<br/>'+
                    'Total: '+ this.point.stackTotal;
            }
        },

        plotOptions: {
            column: {
                stacking: 'normal'
            }
        },

        series: [
        {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#FF0011',
        stack: 0
    }, {
        data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#3333FF',
        stack: 0
    }, {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#FF0011',
        stack: 1
    }, {
        data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#3333FF',
        stack: 1
    }, {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#FF0011',
        stack: 2
    }, {
        data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20],
        color: '#3333FF',
        stack: 2
    }]
    });
  });
 });`

我试过了，但是当我添加标签时，每个条都会出现一个标签。那么，这是怎么做到的？！

4

2 回答 2

11

将此添加到您的系列中：

dataLabels: {
    enabled: true,
    rotation: 0,
    color: '#000000',
    backgroundColor: '#FFFFFF',
    align: 'center',
    x: 4,
    y: 0,
    style: {
        fontSize: '10px',
        fontFamily: 'Verdana, sans-serif'
    }

当然根据需要进行调整..如果需要，您还可以添加 aformatter以添加 $ 符号和大数字的逗号..

编辑：
刚刚看到它是条形图..
您需要将其添加到您的绘图选项中：

plotOptions: {
   bar: {
      dataLabels: {
          enabled: true
      }
   }
},

查看条形图演示以及他们的api 文档

于 2013-03-26T15:57:08.147 回答
4

Highcharts stackLabels 将完成这项工作。 看这里

于 2013-11-21T15:50:04.137 回答