如何在谷歌地图中用多边形标记每个区域？ [英] How to mark each area with polygon in google map?

问题描述

我尝试使用Google地图或任何其他服务创建地图。

在此地图中，我想绘制城市中的每个区域并详细说明。 / p>

这类似于以下

解决方案

您可以使用 KmlLayer 在Google Maps JavaScript API v3地图上显示MyMap中的多边形（等）（您需要一个API密钥）。

URL是通过从您的MyMap中导出KML（下载KML）获得的，同时检查以下两个选项：

• 通过网络链接KML使数据保持最新状态（只能在线使用）。
  
• 导出到.KML文件（用于完整图标支持，然后使用.KMZ）
。

然后使用< href>的内容



 < href> http：//www.google.com/maps/d/kml？forcekml = 1& amp ;安培;中= 1yrtH76JreHzs8bU1-XOoVsEeRS0< / HREF> 
  

程式码片段：



function initialize（）{var map = new google.maps.Map（document.getElementById（map_canvas），{mapTypeId ：google.maps.MapTypeId.ROADMAP}）; var kmlLayer = new google.maps.KmlLayer（{url：http://www.google.com/maps/d/kml?forcekml=1&mid=1yrtH76JreHzs8bU1-XOoVsEeRS0，map：map}）;} google。 maps.event.addDomListener（window，load，initialize）;

html，body，＃map_canvas {height：100％;宽度：100％; margin：0px; < script src =https：//

I am trying to create a map using google map or any other services.

In this map i want to draw each area inside the city and it's details.

This is similar to the following link.

How could i create it using Google map API? Or is there any way same as i did in the mymaps option by google maps?

Please advice me.

解决方案

You can use KmlLayer to display the polygons (etc) from your MyMap on a Google Maps Javascript API v3 map (you will need an API key).

The URL was obtained by exporting the KML ("Download KML") from your MyMap, checking both of the options:

• Keep data up to date with network link KML (only usable online).
• Export to a .KML file (for full icon support, use .KMZ).

Then using the content of the <href> in the resulting file (and removing the HTML entity encoding):

<href>http://www.google.com/maps/d/kml?forcekml=1&amp;mid=1yrtH76JreHzs8bU1-XOoVsEeRS0</href>

code snippet:

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var kmlLayer = new google.maps.KmlLayer({
    url: "http://www.google.com/maps/d/kml?forcekml=1&mid=1yrtH76JreHzs8bU1-XOoVsEeRS0",
    map: map
  });
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>

这篇关于如何在谷歌地图中用多边形标记每个区域？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！