Question

我在JSFiddle上使用以下Highmaps示例： http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/maps/legend/padding-itemmargin/

Stackoverflow要求我提交JSFiddle代码：

$(function () {
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=world-population-density.json&callback=?', function (data) {
    // Initiate the chart
    $('#container').highcharts('Map', {
        chart : {
            borderWidth : 1
        },
        title : {
            text : 'Legend padding and item margin'
        },
        mapNavigation: {
            enabled: true
        },
        legend: {
            title: {
                text: 'Individuals per km²'
            },
            align: 'left',
            verticalAlign: 'bottom',
            floating: true,
            layout: 'vertical',
            valueDecimals: 0,
            backgroundColor: 'rgba(255,255,255,0.9)',
            padding: 12,
            itemMarginTop: 0,
            itemMarginBottom: 0,
            symbolRadius: 0,
            symbolHeight: 14,
            symbolWidth: 24
        },
        colorAxis: {
            dataClasses: [{
                to: 3,
                color: 'rgba(19,64,117,0.05)'
            }, {
                from: 3,
                to: 10,
                color: 'rgba(19,64,117,0.2)'
            }, {
                from: 10,
                to: 30,
                color: 'rgba(19,64,117,0.4)'
            }, {
                from: 30,
                to: 100,
                color: 'rgba(19,64,117,0.5)'
            }, {
                from: 100,
                to: 300,
                color: 'rgba(19,64,117,0.6)'
            }, {
                from: 300,
                to: 1000,
                color: 'rgba(19,64,117,0.8)'
            }, {
                from: 1000,
                color: 'rgba(19,64,117,1)'
            }]
        },

        series : [{
            data : data,
            mapData: Highcharts.maps['custom/world'],
            joinBy: ['iso-a2', 'code'],
            name: 'Population density',
            states: {
                hover: {
                    color: '#BADA55'
                }
            },
            tooltip: {
                valueSuffix: '/km²'
            }
        }]
    });
});   
});

问题：

单击“图例项目”时，将从地图中删除与该范围关联的国家/地区。

但是，它会删除填充和边框。

即使删除国家/地区，如何保留边框？

Answer 1

重复mapData怎么样？像这样：http://jsfiddle.net/gf6jorjm/

在性能方面不是最好的，但你现在有两个独立的地图。现在只需禁用第二张地图上的边框，即可摆脱不必要的边框（重复）。

Highmaps - 图例项目过滤器

1 个答案: