如何更改高图泡泡颜色

时间:2015-06-05 22:10:09

标签: highcharts highmaps

我正在尝试根据城市名称为气泡着色。像是this.point.capital == Montgomery& this.point.capital ==朱诺; color =“red”。但我无法将此函数添加到color属性中。你能帮我吗?

感谢!!!!

series: [{
            name: 'Basemap',
            mapData: map,
            borderColor: '#606060',
            nullColor: 'rgba(200, 200, 200, 0.2)',
            showInLegend: false
        }, {
            name: 'Separators',
            type: 'mapline',
            data: H.geojson(map, 'mapline'),
            color: '#101010',
            enableMouseTracking: false
        }, {
            type: 'mapbubble',
            dataLabels: {
                enabled: true,
                format: '{point.capital}'
            },
            name: 'Cities',
            data: data,
            maxSize: '12%',
            color: H.getOptions().colors[0]
        }]

http://jsfiddle.net/oufwhmz0/

1 个答案:

答案 0 :(得分:3)

在启动图表之前,对data数组中的每个气泡(不是整个系列)执行此操作。例如,扩展您的代码(JSFiddle):

function determineColor(entry) {
    if(entry.capital == "Montgomery")
        return "#FF00FF";
    else if(entry.capital == "Salt Lake City")
        return "#00FF00";
    return null;
}

// Add series with state capital bubbles
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=us-capitals.json&callback=?', function (json) {
    var data = [];
    $.each(json, function (ix, entry) {
        entry.z = entry.population;
        entry.color = determineColor(entry); // Added
        data.push(entry);
    });

    // ... rest as usual
});

根据color函数的定义,这只会为每个entry设置determineColor(这将是一个气泡)。