Question

我有一个高图示例，我可以组合三个图表。 yAxis 0有两个系列，是一个柱形图，yAxis 1是折线图，我有一个饼图，系列4浮动到一边。

这很复杂。然而，除数据标签外，一切都有翻译。他们出于某种原因失败了。它始终是相同的数据标签。

这是我的代码：

$('#container').highcharts({
    chart: {
        zoomType: 'xy',
        marginLeft: 300
    },
    legend: {
        align: 'left',
        verticalAlign: 'top',
        layout: 'vertical',
        x: 60,
        y: 10,
        floating: true
    },
    xAxis: [{
        opposite: true,
        categories: ['Chicago', 'Dubuque', 'Omaha', 'De Pere', 'St. Louis', ]
    }, {
        categories: ['Week 17 2015', 'Week 18 2015', 'Week 19 2015', 'Week 20 2015', 'Week 21 2015', 'Week 22 2015', 'Week 23 2015', 'Week 24 2015', 'Week 25 2015', 'Week 26 2015', 'Week 27 2015', 'Week 28 2015', 'Week 29 2015', ]
    }],
    yAxis: [{
        labels: {
            align: 'right',
            x: -3,
            enabled: false
        },
        title: {
            text: 'Compliance Percentage'
        },
        height: '50%',
        //lineWidth: 2
    }, {
        labels: {
            align: 'right',
            x: -3,
            enabled: false
        },
        title: {
            text: 'Non-compl Events'
        },
        top: '55%',
        height: '45%',
        offset: 0,
    }],
    series: [{
        name: 'Percent compliance',
        type: 'column',
        data: [92, 88, 62, 87, 80],
        xAxis: 0,
        yAxis: 0,
        dataLabels: {
            enabled: true,
            inside: true
        }
    }, {
        name: 'YTD compliance',
        type: 'column',
        data: [91, 72, 66, 81, 75],
        xAxis: 0,
        yAxis: 0,
        dataLabels: {
            enabled: true,
            inside: true
        }
    }, {
        name: 'non-compliant events',
        type: 'line',
        data: [31, 38, 42, 45, 88, 57, 42, 38, 56, 61, 55, 56, 54, ],
        xAxis: 1,
        yAxis: 1,
        dataLabels: {
            enabled: true
        }
    }, {
        type: 'pie',
        fillOpacity: 0.1,
        name: 'Total consumption',
        data: [{
            name: 'ANDERSON, KE',
            y: 4
        }, {
            name: 'HOWARD, DP',
            y: 2
        }, {
            name: 'KNAUB, RD',
            y: 4
        }, {
            name: 'PIQUE, DC',
            y: 7
        }, {
            name: 'WEBSTER, JT',
            y: 6
        }, {
            name: 'Total',
            y: 18
        }],
        center: [-175, 100],
        size: 200,
        showInLegend: false,
        dataLabels: {
            connectorWidth: 1,
            distance: -25,
            borderRadius: 5,
            backgroundColor: 'rgba(252, 255, 255, 0.5)',
            borderWidth: 1,
            formatter: function () {
                return this.point.name + ' ' + this.y;
            },
        }
    }]
});

这是我的小提琴： Highchartsjs with 4 series. 1 Pie, 2 Columns, 1 Line

Answer 1

对我来说这看起来像个错误，但我可能只是不了解重叠计算。将allowOverlap设置为true将使它们全部显示

   {
        name: 'non-compliant events',
        type: 'line',
        data: [31, 38, 42, 45, 88, 57, 42, 38, 56, 61, 55, 56, 54, ],
        xAxis: 1,
        yAxis: 1,
        dataLabels: {
            enabled: true,
            allowOverlap: true
        }
    }

http://jsfiddle.net/c33L58gv/1/

顺便说一句，看起来很漂亮。

某些数据标签不会显示在高图上

1 个答案: