Question

我使用的是高级图表打包的气泡图，我需要根据其值（负值）显示不同大小的气泡。当我传递正值时，它工作正常，但是当传递负值时，圆的大小没有变化。有什么方法可以显示带有负值的图表？

Highcharts.chart('container', {
    chart: {
        type: 'packedbubble',
        height: '100%'
    },
    title: {
        text: 'TOP Countries'
    },
    tooltip: {
        useHTML: true,
        pointFormat: '<b>{point.name}:</b> {point.value}'
    },
    plotOptions: {
        packedbubble: {
            minSize: '30%',
            maxSize: '80%',
            zMin: 0,
            zMax: 1000,
            layoutAlgorithm: {
                splitSeries: false,
                gravitationalConstant: 0.02
            },
            dataLabels: {
                enabled: true,
                format: '{series.name}',
                filter: {
                    property: 'y',
                    operator: '>',
                    value: 250
                },
                style: {
                    color: 'black',
                    textOutline: 'none',
                    fontWeight: 'normal'
                }
            }
        }
    },
    series: [{
        name: 'ASEAN',
        data: [{
            name: "ASEAN",
            value: -88.2
        }]
    }, {
        name: 'KOR ',
        data: [{
            name: "KOR",
            value: -605.2
        }]
    }, {
        name: 'CHN ',
        data: [{
            name: "CHN",
            value: -427233.7
        }]
    }, {
        name: 'ISA ',
        data: [{
            name: "ISA",
            value: -355.39
        }]
    }, {
        name: 'ANZ ',
        data: [{
            name: "ANZ ",
            value: -3331.4
        }]
    }, {
        name: 'JP ',
        data: [{
            name: "JP1",
            value: -22470857.0
        },{
            name: "JP2",
            value: -21470857.0
        }]
    }]
});

带有负值的图形

具有正值的图形

Answer 1

属性zMin和zMax不是官方packedbubble系列API的一部分，但它们在内部使用，其工作方式与bubble系列相同。

plotOptions: {
    packedbubble: {
        minSize: '30%',
        maxSize: '80%',
        //zMin: 0,
        //zMax: 1000,
        ...
    }
}

实时演示： https://jsfiddle.net/BlackLabel/vro2wzL4/

API参考：

https://api.highcharts.com/highcharts/series.packedbubble

https://api.highcharts.com/highcharts/series.bubble.zMin

Highcharts打包的气泡图不适用于负值

1 个答案: