jquery - 鼠标悬停jqvmap时获取元素作为对象

Question

我知道 jqvmap 中鼠标悬停的基本事件是：

onRegionOver: function(event, code, region){

}

目的是在将鼠标悬停在不同的国家/地区时具有不同的光标。

我试过这个：

onRegionOver: function(event, code, region){
     $(this).css('cursor', 'pointer');
}

但是，这实际上是整个世界地图。

预先感谢您的帮助。

Answer 1

有两个问题：如何获取对地图对象的引用，以及如何设置 SVG 形状的样式。

光标样式在 JQVMap CSS 文件中定义，您应该覆盖它。

.jqvmap-region
{
  cursor: pointer;
}

存储对地图对象的引用，并使用此引用来做您需要的事情。

var mapObject;
//...
mapObject = $('#vmap').vectorMap({
    map: 'world_en',
    backgroundColor: '#a5bfdd',
    borderColor: '#818181',
    borderWidth: 1,
    color: '#f4f3f0',
    enableZoom: true,
    hoverColor: '#c9dfaf',
    showTooltip: true,
    //...
    onRegionOver: function(e, code, name){
      var path = mapObject.countries[code];
      path.setAttribute("style", "cursor: grab; cursor:-moz-grab; cursor:-webkit-grab;");
    }
});