繁体   English   中英

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

[英]Highcharts packed bubble chart not working for negative values

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

js小提琴链接的代码示例

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
        }]
    }]
});

带有负值的图

带有负值的图

具有正值的图 具有正值的图

属性zMinzMax不是官方的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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM