ImageMapster：突出显示所有区域，但在单击列表项目时选择特定区域，并显示选择不透明度较低的其他区域

Question

我在下面举例说明： http://jsfiddle.net/jamietre/gjH5c/

我需要完全相同的功能。

但改变是 - 突出显示所有负载区域。因此使用staticState：true。 但是使用上面的选项会在点击列出的项目时禁用区域突出显示的效果。

我需要的是 - 点击列表项目时，我想突出显示/选择相应的区域，但同时保持其他区域的突出显示不透明度。

我尝试更改.mapster的代码，如下所示：

var img=$('img').mapster({
mapKey: 'state',
singleSelect: true,
render_highlight: {
fillOpacity: 0.8
},
render_select: {
fillOpacity: 0.4
},
staticState: true,
singleSelect: true,
});

我也尝试过使用.snapshot和.rebind方法，如下所示： http://jsfiddle.net/6maJw/

它没有用。 请告诉我，如果我遗失了什么。

提前多多感谢

Answer 1

我尝试用ImageMapster做几个小时，直到我决定编写自己的插件：https://github.com/gestixi/pictarea

默认情况下，当您实例化时，它会突出显示所有区域。您可以为正常，悬停，选择和禁用的区域指定不同的样式。

您还可以添加事件处理程序以显示区域，例如，悬停区域时的工具提示。