这并不难，但有几点需要注意。工作示例在这里：
http://jsfiddle.net/gCTcF/
更新：原始示例仅适用于一种方式，此示例适用于两种方式，最后讨论。
http://jsfiddle.net/UrNsH/
1) 您不能将两个图像绑定到同一个图像映射，因为 ImageMapster 将区域视为唯一标识符。所以只需制作一个副本并将第二张图像绑定到副本：
var map = $('map[name="map"]'),
clone = map.clone().attr('name', 'map2'),
image2 = $('#map_mini');
map.after(clone);
image2.attr('usemap', '#map2');
2) 您的方向正确，您需要使用stateChange 来同步地图。从该事件发送的数据并不能完全转换为您需要在另一个地图上调用的代码，因此请根据事件使用一些逻辑来进行正确的调用：
function state_change(data) {
if (data.state=='highlight')
{
// add or remove a highlight to the alternate image. the syntax to add vs.
// remove a highlight is a little different (you don't need to specify where
// you're removing - there can be only one highlight) so easiest to use two
// different statements for add vs. remove.
if (data.selected) {
image2.mapster('highlight',data.key,true);
} else {
image2.mapster('highlight',false);
}
} else if (data.state=='select') {
// add or remove the "selected" state to the alternate image.
// the syntax is the same to add and remove (unlike highlight) so you
// just need one statement.
image2.mapster('set',
data.selected,
data.key);
}
}
3) 创建两个地图将共享的选项的变量，并使用控制另一个地图的stateChange 事件扩展它。这将进行单向同步。如果您希望它以两种方式同步，则需要复制 stateChange 函数，或者添加一个参数，以便它知道应该对哪个映射进行操作。 （如果您只是将两个地图绑定到同一个事件，则在从它所针对的同一个地图执行操作时会导致无限循环。
var options = {
singleSelect: true,
isDeselectable: false,
fill: true,
fillColor: 'ff0000',
fillOpacity: 0.5
};
$('#map_mini').mapster(options);
$("#map_full").mapster(
$.extend({}, options, {
onStateChange: state_change
}));
希望对您有所帮助。
更新：
要让它像您发现的那样双向工作，您必须防止递归。
更新示例：http://jsfiddle.net/UrNsH/
首先，在开头创建对两个图像的引用：
var image1 = $('#map_full'),image2 = $('#map_mini');
在state_change函数中，使用一个标志来表示代码当前正在改变状态。这样，当state_change 由于它自己的操作而再次触发时，它将知道不会启动另一个事件。这非常简单：在函数外部创建一个变量以用作标志。您要做的第一件事是检查您当前是否正在“改变”，如果是，请退出。如果不是，请在开始对第二张图片执行操作之前将“更改”标记为 true。
现在发生的另一件事是您需要确定要对哪个图像进行操作。这个逻辑很简单：它是鼠标事件不是的来源。您只需要检查this 是图像本身并选择不是this 的图像。
您会注意到我将this 与image1[0] 进行比较。这是 jQuery 经常出现的问题。 this 是一个实际的 DOM 元素，而 image1 和 image2 是 jQuery 对象。 jQuery 对象是array-like。因此，要访问作为选择器一部分的实际 DOM 元素，您必须使用索引。 image1[0] 是 image1 的第一个（也是唯一一个）成员，当第一个图像是事件的源时，它将匹配 this。
var changing = false;
function state_change(data) {
// prevent recursion: exit if already inside this function
if (changing) return;
// set the flag that work is in progress so if something calls this while
// we're busy syncing, it won't try to start again (creating endless recursion)
changing = true;
// switch the image that's not this one.
var target = this===image1[0] ?
image2 :
image1;
// this part is the same as before
if (data.state=='highlight'){
if (data.selected) {
target.mapster('highlight',data.key,true);
} else {
target.mapster('highlight',false);
}
} else if (data.state=='select') {
target.mapster('set', data.selected, data.key);
}
changing=false;
}
应该这样做！