Question

我正在看这个示例here。该示例描绘了在条形图上显示条形图的值。我希望这样做是可以在条形图上显示“ Apples”，“ Oranges”等图例名称的方法。

到目前为止，我所做的是：

Highcharts.chart('chartDiv_'+widgetId, {
    chart: {
        type: 'bar'
    },
    title: {
        text: 'Project Release Chart'
    },
    xAxis: {
        categories: x_axis
    },
    yAxis: {
        min: 0,
        max: 100,
        reversedStacks : false,
        labels: {
            formatter: function() {
                return this.value+"%";
            }
        },
        title: {
            text: 'Percentage'
        }
    },
    credits: {
        enabled: false
    },
    tooltip: {
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
        shared: false
    },
    legend: {
        //enabled: false,
        reversed: false
    },
    plotOptions: {
        series: {
            /*events: {
                legendItemClick: function() {
                    return false;
                }
            },*/
            stacking: 'percentage',
            pointWidth: 60,
            dataLabels: {
                enabled: true
            }
        }
    },
    series: y_axis
});

我想用图例名称代替条形图上的值。

Answer 1

我能够通过自定义“ plotOptions”的“ dataLabels”属性来做到这一点。我在plotOptions中添加了以下代码：

plotOptions: {
        series: {
            stacking: 'percentage',
            pointWidth: 60,
            dataLabels: {
                enabled: true,
                format : '{series.name}',
                style : {
                    color: '#DCDCDC', 
                    fontSize: '15px', 
                    fontWeight: 'pointer', 
                    textOutline: '0px contrast'
                }
            }
        }
    },

->格式：“ {series.name}”要具体

图例以条形图命名而不是值

1 个答案: