风格个别地区在jvectormap

我有一个自定义jVectorMap，我已经成功地改变了使用此代码从jVectorMap API区域的颜色：

regionStyle: { 
     initial: { 
     fill: '#5e7073', 
     "fill-opacity": 1, 
     stroke: 'none', 
     "stroke-width": 0, 
     "stroke-opacity": 1 
     }, 
     hover: { 
     fill: 'black' 
     },

但我试图控制地图各个区域的填充/悬停属性，分别为。有没有人这样做或了解如何实现它？我查看了jVectorMap API，但无济于事。

马卡报

来源

2013-04-03 Marcatectura

首先，你需要知道你正在改变地区代码。你从你使用的地图文件中获得这些。以下示例适用于美国地图。

regionStyle: { 
    //... 
}, 
series: { 
    regions: [{ 
     values: { 
      'US-CA': '#3e9d01', 
      'US-WA': '#4b93c1', 
      'US-TX': '#c1a14b' 
     }, 
     attribute: 'fill' 
    }] 
}

或者你可以自定义它们在飞行（和“价值观”上面的参数就没有必要）：

对于更改填充，你可以在创建地图自定义区域

$(function(){ 
    var map = $('#map').vectorMap('get', 'mapObject'); 
    map.series.regions[0].setValues({ 
     'US-CA': '#3e9d01' 
    }); 
});

来源

2013-04-05 12:37:47 David

重要的是要注意，如果您正在使用“比例”，您需要使用比例值设置值。因此，如果这是我的系列，系列：{ \t \t \t \t地区：[{ \t \t \t \t \t规模：{ \t \t \t \t \t红： '＃FF0000'， \t \t \t \t \t蓝：“ ＃0000ff'， \t \t \t \t \t Swing：'＃00ff00' \t \t \t \t \t}， \t \t \t \t \t属性： '填充'， \t \t \t \t \t值：{ \t \t \t \t \t}， \t \t \t \t \t图例：{ \t \t \t \t \t水平：真实， \t \t \t \t \t标题： '政治路线' \t \t \t \t \t} \t \t \t \t}] \t \t \t}，然后你说，VAR myCustomColors = { \t \t \t“ US-CA'：'Swing'， \t \t \t'US-TX'：'Swing'， \t \t \t 'US-FL'： '摆动' \t \t} ;,然后... \t \t \t map.series.regions [0] .setValues（myCustomColors）; –

我把在jQuery的jvectormap-1.1.1.js一个自定义的方法

支票http://pastebin.com/MSt94XuH

所有脚本

setSelectedRegionStyle : function (r,c) { 
return this.regions[r].element.style.selected.fill = c; 
},

你需要得到参考地图：

map = $("#world-map-gdp").vectorMap('get', 'mapObject');

，并设置自定义样式每个国家：

map.setSelectedRegionStyle('IT', '#b2c9cb'); 
map.setSelectedRegionStyle('AT', '#b2c9cb'); 
map.setSelectedRegionStyle('BE', '#b2c9cb');

如果你需要清除所有样式使用：

map.clearSelectedRegions();

来源

2013-04-12 18:19:57

风格个别地区在jvectormap

回答

相关问题