如何使用Google Maps API绘制南非各省较暗的边界 [英] How to draw darker borders of the provinces in South Africa with Google Maps API

问题描述

我正在使用 Google Maps API 。我来自南非，并希望显示南非的地图及其边界清楚标记的省份。我在南非的网页上有地图，但我不知道如何让用户更容易看到各省的边界。我假设的点状浅灰线是各省的边界线？

我的地图HTML容器：

 < div id =map-canvas>< / div> 
  

我的JavaScript：

 < script type =text / javascript> 
 var map; 
 
函数初始化（）{
 var mapOptions = {
 center：new google.maps.LatLng（-33.49559749315654,20.93444836718755），
 zoom：8，
 mapTypeId：google.maps.MapTypeId.ROADMAP 
}; 
 map = new google.maps.Map（document.getElementById（map-canvas），
 mapOptions）; 
} 
 
 google.maps.event.addDomListener（window，'load'，initialize）; 
< / script> 
  

我如何获取和绘制南非各省的边界线较暗。

解决方案

您需要自行绘制边框。

最简单的方法：使用一个FusionTableLayer，这里是一个包含各省几何的FusionTable： https://www.google.com/fusiontables/DataSource?docid=16L-UK_1OZxGw6DlKR8V8yP4XZrtmNdOMugRRNrQ#map:id=3

用法：

 < script type =text / javascript> 
函数initialize（）{
 var map = new google.maps.Map（document.getElementById（'map-canvas'），{
 center：new google.maps.LatLng（-33.49559749315654 ，20.93444836718755），
 zoom：4，
 mapTypeId：google.maps.MapTypeId.ROADMAP 
}）; 
 //创建图层
 layer = new google.maps.FusionTablesLayer（{
 map：map，
 //图层不需要点击
 clickable：false，
 query：{
 //带有几何形状的列
 select：col2，
 // table-ID 
 from：16L-UK_1OZxGw6DlKR8V8yP4XZrtmNdOMugRRNrQ ，
其中：
}，
款式：[{
 polygonOptions：{
 // border-color 
 strokeColor：＃000000 ，
 // border-width 
 strokeWeight：2，
 //隐藏填充值
 fillOpacity：0.0001 
}}] 
}）; 
} 
 
 google.maps.event.addDomListener（window，'load'，initialize）; 
< / script> 
  

I am using the Google Maps API. I am from South Africa and would like to show a map of South Africa with its borders for the provinces clearly marked. I have the map on my web page of South Africa but I have no idea how to get the borders of the provinces a bit more visible to the user. There is dotted light grey lines which I am assuming is the border lines of the provinces?

My HTML container for the map:

<div id="map-canvas"></div>

My JavaScript:

<script type="text/javascript">
     var map;

     function initialize() {
          var mapOptions = {
               center: new google.maps.LatLng(-33.49559749315654, 20.93444836718755),
               zoom: 8,
               mapTypeId: google.maps.MapTypeId.ROADMAP
          };
          map = new google.maps.Map(document.getElementById("map-canvas"),
               mapOptions);
     }

     google.maps.event.addDomListener(window, 'load', initialize);
</script>

How do I get and draw the border lines of the provinces in South Africa darker.

解决方案

You need to draw the borders on your own.

Easiest way: use a FusionTableLayer, here is a FusionTable that contains the geometry of the provinces: https://www.google.com/fusiontables/DataSource?docid=16L-UK_1OZxGw6DlKR8V8yP4XZrtmNdOMugRRNrQ#map:id=3

Usage:

<script type="text/javascript">
  function initialize() {
     var map = new google.maps.Map(document.getElementById('map-canvas'), {
      center: new google.maps.LatLng(-33.49559749315654, 20.93444836718755),
               zoom: 4,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    //create the layer
    layer = new google.maps.FusionTablesLayer({
      map: map,
      //the layer doesn't need to be clickable
      clickable:false,
      query: {
      //column with the geometry
        select: "col2",
      //table-ID
        from: "16L-UK_1OZxGw6DlKR8V8yP4XZrtmNdOMugRRNrQ",
        where: ""
      },
      styles: [{
        polygonOptions: {
        //border-color
        strokeColor: "#000000",
        //border-width
        strokeWeight: 2,
        //hide the fill
        fillOpacity:0.0001
      }}]
    });
  }

  google.maps.event.addDomListener(window, 'load', initialize);
</script>

这篇关于如何使用Google Maps API绘制南非各省较暗的边界的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！