JVectorMap:深入了解自定义区域

时间:2017-07-17 12:50:25

标签: javascript jvectormap

有没有办法制作组合地图,可以对某些区域使用"drill-down"行为,为其他区域使用"select"行为?

2 个答案:

答案 0 :(得分:0)

没有任何标准可以达到这一目标。

要解决这个问题,我必须修改MultiMap文件。在addMap功能中,您可以添加 硬编码检查区域代码或将其添加到配置并传递或拒绝向下钻取。

答案 1 :(得分:0)

我相信您所要求的也可以通过jVectorMap提供的一些标准功能来实现。在下面的示例中,可以选择除德克萨斯州以外的所有美国地区,从而仅针对US-TX执行正常的多地图下钻。

$(document).ready(function () {
  new jvm.MultiMap({
    container: $('#map'),
    maxLevel: 1,
    main: {
      map: 'us_lcc',
      regionsSelectable: true,
      regionStyle: {
        selected: {
            fill: 'green'
          }
        },
        onRegionClick: function(event, code) {
          if(code == "US-TX") {
            return false;
          } else {
            event.stopImmediatePropagation();
          }
        }
      }
  });
});

<强>解释

正如文档所说here,MultiMap对象的主Map可以像“普通”Map一样进行配置。

在多地图onRegionClick处理程序中,可以通过返回false来避免区域选择,并且可以通过调用stopImmediatePropagation()来停止向下钻取。我用jVectorMap版本2.0.2测试了这个片段,但它也适用于最新版本。

顺便说一句,感谢bjornd获得了很棒的jVectorMap。