jvectormap如何在选择区域时保持当前颜色?

时间:2014-03-03 15:07:44

标签: colors fill selected region jvectormap

这是我的问题,我有不同国家的颜色比例。当我选择一个国家,它的颜色变化,我不想。

我只想使用stroke属性(没有fill属性)来显示所选区域。

问题是填充的默认颜色是“黄色”。我尝试将所选区域的fill属性设置为“none”,但在选中时会删除当前颜色。

你们有办法解决这个问题吗?

        $('#worldMap').vectorMap({
        map: 'world_mill_en',
        series: {
            regions: [{
                scale: ['#C1E712', '#5F7209'],
                values: countryHitCounts,
            }]
        },
        regionStyle: {
            selected: {
                fill: <= is there a keyword to not change the color when selected??
                stroke: 'red',
                "stroke-width": 1,
            },
        },
        regionsSelectable: true,
        selectedRegions: countrySelected,
        onRegionSelected: function (event, code, isSelected, selectedRegions) {
               //some code...
        },
    });

编辑:在minify js代码源文件中,我更改了所选区域的默认样式。 选择了:{fill:“yellow”} 选择:{} 它可以工作,但如果你有一个更好的解决方案而不更改源文件,我会接受它。

3 个答案:

答案 0 :(得分:1)

我遇到了同样的问题,似乎对我有用的是用无效的十六进制代码覆盖选定的填充。例如:

regionStyle: {
            selected: {
                fill: '#Z34FF9'
            }
        },

这似乎将它注册为覆盖,但实际上并没有应用它,留下我的原始颜色。

答案 1 :(得分:0)

您必须阻止点击的默认操作:

,
onRegionClick: function(event, code){
    event.preventDefault();
    // your "some code" of region selected
}

答案 2 :(得分:0)

Norrec的回答对我不起作用,但我可以在创建地图之前覆盖类默认值。无需修改源代码!

jvm.Map.defaultParams.regionStyle.selected = {};
map = new jvm.Map({
    map: 'world_mill',
    container: jQuery('#world-map'),
    regionStyle: {
        initial: {
            fill: "#F6F6F6",
        },
      selected: {
        stroke: '#FF00FF',
        "stroke-width": 0.5,
      }
    },
}