jvectormap

Question

我已经完成了以下...

我下载了科罗拉多县的 .svg

然后用 notepad/notepad++ 等打开 .svg 并将所有内容粘贴到此站点，将其转换为 jvectormap。

现在我已经完成了，我想知道如何将县纳入我的美国地图。可以在此处找到这方面的示例：http://jvectormap.com/examples/drill-down/ 当您单击其中一个州时，它会放大并显示县。

目前我拥有的是：

<!DOCTYPE html>
<html>
<head>
  <title>jVectorMap demo</title>
  <link rel="stylesheet" href="jquery-jvectormap-2.0.1.css" type="text/css" media="screen"/>
  <script src="jquery.js"></script>
  <script src="jquery-jvectormap-2.0.1.min.js"></script>
  <script src="jquery-jvectormap-us-aea-en.js"></script>
  <script src="co-counties.js"></script>
</head>
<body>
  <div id="map" style="width: 600px; height: 400px"></div>
  <script>
    $(function(){
  new jvm.MultiMap({
    container: $('#map'),
    maxLevel: 1,
    main: {
      map: 'us_aea_en'
    },
    mapUrlByCode: function(code, multiMap){
      return '/js/us-counties/jquery-jvectormap-data-'+
             code.toLowerCase()+'-'+
             multiMap.defaultProjection+'-en.js';
    }
    });
    });
  </script>
</body>
</html>

当你点击它时它会放大一个州，但现在我需要它来转换到县视图。

此外，我的科罗拉多县 jvectormap 当前命名为 'co-counties.js'

如有任何帮助，我们将不胜感激！

谢谢！

Answer 1

我通过下载 jvectormap 的完整项目解决了所有州的这个问题 - http://jvectormap.com/download/

并且在 /tests/assets/us 下，作者包含了所有需要的 js 文件。只需将它们复制到您的项目并使用：

new jvm.MultiMap({
  container: $('.jvectormap-container'),
  maxLevel: 1,
  main: {
    map: 'us_lcc_en'
  },
  mapUrlByCode: function(code, multiMap){
    return '../js/counties/jquery-jvectormap-data-'+
           code.toLowerCase()+'-'+
           multiMap.defaultProjection+'-en.js';
  }
});

它会按需加载每个县地图

jvectormap - 如何合并县数据

jvectormap - How to incorporate county data

javascript

dictionary

drilldown