javascript - 如何在 Highcharts 树状图中获取百分比轴？

Question

我有一个 HighCharts 树形图，显示一组包含子类别的类别。该图的重点是显示有多少数据属于类别 A，以及有多少数据属于类别 A1。

我的创建如下:

http://jsfiddle.net/jbcfk93m/

$(function () {
$('#container').highcharts({
    series: [{
        colorByPoint: true,
        layoutAlgorithm: "stripes",
        alternateStartingDirection: true,
        allowPointSelect: true,
        point: {
            events: {
                click: function () {
                        alert(this.name + ": " + this.value);
                    }
                }
        },
        dataLabels: {

        },
        type: "treemap",
        levels: [{
            level: 1,
            dataLabels: {
                enabled: true,
                align: 'right',
                rotation: 30,
                crop: false,
                overflow: 'none',
                inside: false,
                style: {
                    fontSize: '15px',
                    fontWeight: 'bold'
                }
            }
        }, {
            level: 2,
            dataLabels: {
                style: {
                }
            },
            layoutAlgorithm: "stripes",
        }],
        data: [{
            // Add parents without values
            id: 'CategoryA',
            name: 'Category A'
        }, {
            id: 'CategoryB',
            name: 'Category B',
        }, {
            // And the children with values
            name: 'Subcat A1',
            value: 4,
            parent: 'CategoryA'
        }, {
            name: 'Subcat A2',
            value: 6,
            parent: 'CategoryA'
        }, {
            name: 'Subcat B1',
            value: 6,
            parent: 'CategoryB'
        }, {
            name: 'Subcat B2',
            value: 2,
            parent: 'CategoryB'
        }
        ]
    }],
    title: {
        text: 'Treemap',
        margin: 100
    },
    xAxis: {
        min: 0,
        max: 100
    }
});
});

我希望图表中的 X 轴和 Y 轴都显示百分比，以便我可以更轻松地了解有多少数据属于特定类别。

有人知道怎么做吗？

Answer 1

我在树形图上没有找到任何有关轴的信息，并且我不确定在 X 和 Y 轴上显示百分比是否会对您有很大帮助，因为您基本上必须将 X 和 Y 上的值相乘(例如如果您的子目录 B1 在 X 轴上从 20% 到 100%，在 Y 轴上从 60% 到 100%，那么您必须执行 (100% - 20%) * (100% - 60%) = 32%) .

但是，我确实实现了一个工具提示格式化程序，当您将鼠标悬停在子类别上时，它会显示百分比。

formatter: function () {
    var total = 0;
    for (var i = 0; i < this.series.data.length; i++)
    {
        if (this.series.data[i].node.children.length == 0)
        total+=this.series.data[i].node.val;
    }
    var value;
    if (this.point.node.children.length == 0)
    {
        value = this.point.options.value;
    }
    else
    {
        value = this.point.node.childrenTotal;
    }

    return this.key + " " + (value / total) *100 + " %";
}

这是工作 fiddle http://jsfiddle.net/jbcfk93m/4/