JQVMAP选定区域使用JSFIDDLE Demo取消选择
好的，我在我的网站上有一个JQVMAP来选择搜索框的状态。 在我添加Clearfunction之前，一切都很顺利。
我还必须将成员HardCode Link中的补丁合并到补丁中
找到解决方案，将jqvmap.js文件中的第466行更改为：
regionClickEvent = $.Event('regionClick.jqvmap'); jQuery(params.container).trigger(regionClickEvent, [code, mapData.pathes[code].name]);
这是我初始化它的方式：
// with this Code it will select states and change the color of selected states plus save the codes of selected states into a hidden field $('#omap').vectorMap( { map: 'usa_en', backgroundColor: '#fff', borderColor: '#000', borderWidth: 4, color: '#f4f3f0', enableZoom: false, hoverColor: '#fece2f', hoverOpacity: null, normalizeFunction: 'linear', scaleColors: ['#b6d6ff', '#005ace'], selectedColor: '#db9b15', selectedRegion: null, showTooltip: true, multiSelectRegion: true, onRegionClick: function(element, code, region) { if(highlight[code]!=='#db9b15'){ highlight[code]='#db9b15'; origin = $('#search_origin_states'); states = origin.val(); if (states == ""){ origin.val(code); } else { origin.val(states + "," + code); } } else { highlight[code]='#f4f3f0'; states = origin.val(); if (states.indexOf(","+code) >= 0) { states = states.replace(","+code,""); origin.val(states); } else if (states.indexOf(code+",") >= 0){ states = states.replace(code+",",""); origin.val(states); } else { states = states.replace(code,""); origin.val(states); } } $('#omap').vectorMap('set', 'colors', highlight); } });
我用来点击每个状态来清除它。 但是我写了一个脚本来一键清除所有内容。
function search_map_clear(field, map) { var states = $('#search_' + field + '_states'); var sel_states = states.val(); var highlight2 = []; $.each(sel_states.split(','), function (i, code) { highlight2[code] = '#f4f3f0'; $('#' + map).vectorMap('set', 'colors', highlight2); }); states.val(""); }
这会将所有颜色更改回原始颜色，但显然它不会清除selectedRegions因为清除之后如果我选择任何其他状态，我更改回原始颜色的所有状态都会显示为备份。
我的问题是：
如何清除所选状态，以便我可以选择不同的状态，而无需单击之前选择的每个状态
UPDATE
我已经能够从控制台运行此命令，我可以选择和取消选择状态…但它不会取消选择被单击以选择的状态。
$('#omap').vectorMap('select', 'ar'); $('#omap').vectorMap('deselect', 'ar');
我需要清除已被点击的状态……
这是我的jsFiddle，它将向您展示正在发生的事情：
JSFIDDLE DEMO
您将信息存储在变量highlight ，然后使用highlight2清除地图。 它不会更改highlight的信息，因此当您触发onRegionClick() ，它将更改回您选择的内容。
使用全局变量让highlight范围跨越两个脚本，然后通过highlight替换highlight并删除highlight2 declation。
在这里看到jsfiddle ，我想这就是你想要的。
我刚刚将这个函数添加到库中
setSelectedRegions: function(keys){ for (var key in this.countries) { this.deselect(key, undefined); } var array = keys.split(","); for (i=0;i
并在以后用作它
jQuery('#vmap').vectorMap('set', 'selectedRegions', 'gb,us');