搜索
搜索

OSM到Google Maps多边形

artuska 发表于 Dev
75
阿图斯卡

我想使用Polygon类和经/纬度坐标数组在Google地图上绘制市区区域。

OpenStreetMap为我提供了我需要的所有数据-如果我键入一些地区名称，我可以OSM XML格式获得有用的数据，例如，拉脱维亚首都里加的OSM绘制的“ Vecmilgravis”地区多边形，以及OSM XML格式的数据。

问题是所有这些node节点都以某种奇怪的顺序排序，因此，如果我仅提取所有节点lat并lng成对并为Google Maps Polygon类创建一个坐标数组，我将看不到我所期望的：

在此处输入图片说明

标记正确显示，“ cos坐标顺序对它们并不重要，但多边形却弄乱了”，我从OSM数据中复制了错误的坐标顺序。

那么，如何以正确的顺序提取（或手动排序）OSM节点坐标？

地理编码

这可能是“正确”的方法：

  1. 通过XML解析，将节点及其关联的ID保存
  2. 解析“ way”标签以在这些细分中对其进行排序
  3. 将“路径”路径首尾相连（假设相邻路径有一个公共点）
  4. 用完成的路径创建一个多边形

（可能有一种更有效的方法）

输出的屏幕截图

代码段：

var geocoder;
var map;
var centerPt;
var markers = [];

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var path = [];
  var xmldata = xmlParse(xmlBoundaryData);
  var nodes = xmldata.getElementsByTagName("node");
  var bounds = new google.maps.LatLngBounds();
  var nodeArray = [];
  // get the coordinate data out of the "nodes"
  for (var i = 0; i < nodes.length; i++) {
    var pt = new google.maps.LatLng(nodes[i].getAttribute("lat"),
      nodes[i].getAttribute("lon"));
    path.push(pt);
    nodeArray[nodes[i].getAttribute("id")] = pt;
    var marker = new google.maps.Marker({
      position: pt,
      map: map,
      title: "" + i
    })
    markers.push(marker);
    bounds.extend(pt)
  }
  var waysArray = [];
  // get the ways, putting the "nodes" in "way" order
  var ways = xmldata.getElementsByTagName("way");
  for (var j = 0; j < ways.length; j++) {
    var waypath = [];
    var nd = ways[j].getElementsByTagName("nd");
    for (var i = 0; i < nd.length; i++) {
      waypath.push(nodeArray[nd[i].getAttribute("ref")]);
    }
    waysArray.push(waypath);
    var waypoly = new google.maps.Polyline({
      path: waypath,
      map: map,
      strokeColor: "#0000FF"
    })
  }
  // assemble the "ways" into a polygon by concatenating together at the common points
  console.log("number of ways="+waysArray.length);
  var polypath = [];
  for (var i = 0; i < waysArray.length; i++) {
    if (i == 0) {
      // first "way"
      console.log("way 0, ends at " + waysArray[i][0].toUrlValue(6));
      for (var j = 0; j < waysArray[i].length; j++) {
        polypath.push(waysArray[i][j]);
      }
    } else if (polypath[polypath.length - 1].equals(waysArray[i][0])) {
      console.log("way " + i + ", ends at " + waysArray[i][0].toUrlValue(6));
      for (var j = 1; j < waysArray[i].length; j++) {
        polypath.push(waysArray[i][j]);
      }
    } else if (polypath[polypath.length - 1].equals(waysArray[i][waysArray[i].length - 1])) {
      console.log("way " + i + " (rev), ends at " + waysArray[i][waysArray[i].length - 1].toUrlValue(6));
      for (var j = waysArray[i].length - 2; j >= 0; j--) {
        polypath.push(waysArray[i][j]);
      }
    } else {
      // not adjacent to the end, try again later (push it on to the end of the array)
      waysArray.push(waysArray[i]);
    }
  }
  var polygon = new google.maps.Polygon({
    map: map,
    path: polypath
  });
  map.fitBounds(bounds);
}

google.maps.event.addDomListener(window, "load", initialize);

function xmlParse(str) {
  if (typeof ActiveXObject != 'undefined' && typeof GetObject != 'undefined') {
    var doc = new ActiveXObject('Microsoft.XMLDOM');
    doc.loadXML(str);
    return doc;
  }

  if (typeof DOMParser != 'undefined') {
    return (new DOMParser()).parseFromString(str, 'text/xml');
  }

  return createElement('div', null);
}
var xmlBoundaryData = '<?xml version="1.0" encoding="UTF-8"?><osm version="0.6" generator="CGImap 0.4.0 (20233 thorn-01.openstreetmap.org)" copyright="OpenStreetMap and contributors" attribution="http://www.openstreetmap.org/copyright" license="http://opendatacommons.org/licenses/odbl/1-0/"><node id="939092112" visible="true" version="3" changeset="9125708" timestamp="2011-08-25T22:47:10Z" user="Raitisx" uid="105318" lat="57.0408668" lon="24.0680754"><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></node><node id="956004391" visible="true" version="5" changeset="36231114" timestamp="2015-12-28T22:52:59Z" user="AkageMuk" uid="2012081" lat="57.0299437" lon="24.1089277"><tag k="name" v="Vecmīlgrāvis"/><tag k="name:de" v="Alt-Mühlgraben"/><tag k="name:lv" v="Vecmīlgrāvis"/><tag k="name:ru" v="Вецмилгравис"/><tag k="place" v="suburb"/><tag k="wikipedia" v="lv:Vecmīlgrāvis"/><tag k="wikipedia:ru" v="Вецмилгравис"/></node><node id="1412648728" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:50Z" user="Raitisx" uid="105318" lat="57.0237064" lon="24.1172858"/><node id="1412648732" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:50Z" user="Raitisx" uid="105318" lat="57.0237837" lon="24.1146783"/><node id="1412648733" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0239283" lon="24.1201001"/><node id="1412648734" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0239694" lon="24.1120189"/><node id="1412648735" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0244130" lon="24.1218642"/><node id="1412648741" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0252736" lon="24.1235470"/><node id="1412648742" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0252901" lon="24.1068387"/><node id="1412648745" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0259421" lon="24.0865922"/><node id="1412648749" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0267091" lon="24.1003177"/><node id="1412648750" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0272530" lon="24.0901290"/><node id="1412648753" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0272650" lon="24.1261230"/><node id="1412648754" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0277863" lon="24.0940634"/><node id="1412648755" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0277928" lon="24.0850352"/><node id="1412648760" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:51Z" user="Raitisx" uid="105318" lat="57.0298488" lon="24.1289978"/><node id="1412648766" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0322322" lon="24.0795026"/><node id="1412648767" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0324695" lon="24.1317941"/><node id="1412648768" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0336179" lon="24.1289290"/><node id="1412648769" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0342914" lon="24.1256628"/><node id="1412648770" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0346037" lon="24.1223190"/><node id="1412648771" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0348498" lon="24.1188739"/><node id="1412648772" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0348667" lon="24.0758427"/><node id="1412648775" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0353858" lon="24.1167861"/><node id="1412648783" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0377249" lon="24.1087940"/><node id="1412648786" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:52Z" user="Raitisx" uid="105318" lat="57.0382325" lon="24.0717365"/><node id="1412648787" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0383366" lon="24.1072823"/><node id="1412648788" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0398108" lon="24.1061825"/><node id="1412648789" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0403684" lon="24.1061945"/><node id="1412648792" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0418628" lon="24.1028049"/><node id="1412648793" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0425852" lon="24.0987029"/><node id="1412648798" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0430687" lon="24.0645903"/><node id="1412648799" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0438158" lon="24.0914262"/><node id="1412648807" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0457390" lon="24.0602339"/><node id="1412648809" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:53Z" user="Raitisx" uid="105318" lat="57.0473897" lon="24.0573897"/><node id="1412648814" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0485238" lon="24.0617057"/><node id="1412648815" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0489709" lon="24.0779074"/><node id="1412648819" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0492422" lon="24.0800514"/><node id="1412648821" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0493233" lon="24.0747645"/><node id="1412648822" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0493467" lon="24.0661118"/><node id="1412648828" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0497404" lon="24.0808749"/><node id="1412648829" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0501426" lon="24.0720512"/><node id="1412648830" visible="true" version="1" changeset="9125708" timestamp="2011-08-25T22:45:54Z" user="Raitisx" uid="105318" lat="57.0501439" lon="24.0696934"/><node id="939092310" visible="true" version="3" changeset="9125708" timestamp="2011-08-25T22:47:11Z" user="Raitisx" uid="105318" lat="57.0299390" lon="24.0828947"><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></node><node id="2001673384" visible="true" version="2" changeset="27351748" timestamp="2014-12-09T09:08:56Z" user="AkageMuk" uid="2012081" lat="57.0379682" lon="24.1081640"/><node id="1412648777" visible="true" version="2" changeset="13788614" timestamp="2012-11-07T18:35:26Z" user="briedisUNrepshe" uid="780955" lat="57.0365649" lon="24.1126203"/><node id="1940326011" visible="true" version="2" changeset="27418924" timestamp="2014-12-12T11:12:48Z" user="AkageMuk" uid="2012081" lat="57.0454766" lon="24.0884690"/><way id="127683755" visible="true" version="3" changeset="13314024" timestamp="2012-09-30T19:10:18Z" user="iav" uid="80180"><nd ref="1412648789"/><nd ref="1412648792"/><nd ref="1412648793"/><nd ref="1412648799"/><nd ref="1940326011"/><nd ref="1412648828"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="127683753" visible="true" version="2" changeset="9316551" timestamp="2011-09-16T14:24:13Z" user="Raitisx" uid="105318"><nd ref="1412648767"/><nd ref="1412648760"/><nd ref="1412648753"/><nd ref="1412648741"/><nd ref="1412648735"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="127683754" visible="true" version="2" changeset="9316551" timestamp="2011-09-16T14:24:14Z" user="Raitisx" uid="105318"><nd ref="1412648735"/><nd ref="1412648733"/><nd ref="1412648728"/><nd ref="1412648732"/><nd ref="1412648734"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="127683772" visible="true" version="2" changeset="9316551" timestamp="2011-09-16T14:24:15Z" user="Raitisx" uid="105318"><nd ref="1412648734"/><nd ref="1412648742"/><nd ref="1412648749"/><nd ref="1412648754"/><nd ref="1412648750"/><nd ref="1412648745"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="127683719" visible="true" version="3" changeset="13788614" timestamp="2012-11-07T18:35:30Z" user="briedisUNrepshe" uid="780955"><nd ref="1412648789"/><nd ref="1412648788"/><nd ref="1412648787"/><nd ref="2001673384"/><nd ref="1412648783"/><nd ref="1412648777"/><nd ref="1412648775"/><nd ref="1412648771"/><nd ref="1412648770"/><nd ref="1412648769"/><nd ref="1412648768"/><nd ref="1412648767"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="127683787" visible="true" version="2" changeset="9316551" timestamp="2011-09-16T14:24:16Z" user="Raitisx" uid="105318"><nd ref="1412648809"/><nd ref="1412648814"/><nd ref="1412648822"/><nd ref="1412648830"/><nd ref="1412648829"/><nd ref="1412648821"/><nd ref="1412648815"/><nd ref="1412648819"/><nd ref="1412648828"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="80499981" visible="true" version="6" changeset="9316551" timestamp="2011-09-16T14:24:32Z" user="Raitisx" uid="105318"><nd ref="939092112"/><nd ref="1412648798"/><nd ref="1412648807"/><nd ref="1412648809"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><way id="80500002" visible="true" version="4" changeset="9316551" timestamp="2011-09-16T14:24:35Z" user="Raitisx" uid="105318"><nd ref="939092112"/><nd ref="1412648786"/><nd ref="1412648772"/><nd ref="1412648766"/><nd ref="939092310"/><nd ref="1412648755"/><nd ref="1412648745"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="source" v="Rīgas pilsētas teritorijas plānojums"/></way><relation id="1727775" visible="true" version="4" changeset="36231114" timestamp="2015-12-28T22:52:41Z" user="AkageMuk" uid="2012081"><member type="way" ref="127683755" role="outer"/><member type="way" ref="127683719" role="outer"/><member type="way" ref="127683753" role="outer"/><member type="way" ref="127683754" role="outer"/><member type="way" ref="127683772" role="outer"/><member type="way" ref="80500002" role="outer"/><member type="way" ref="80499981" role="outer"/><member type="way" ref="127683787" role="outer"/><member type="node" ref="956004391" role="admin_centre"/><tag k="admin_level" v="10"/><tag k="boundary" v="administrative"/><tag k="name" v="Vecmīlgrāvis"/><tag k="name:de" v="Alt-Mühlgraben"/><tag k="name:lv" v="Vecmīlgrāvis"/><tag k="name:ru" v="Вецмилгравис"/><tag k="type" v="boundary"/></relation></osm>';
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map_canvas"></div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何使用Google Maps API V3显示多边形和多边形

点击时google maps多边形，显示多边形内标记的摘要

react-google-maps 中带孔的多边形

带有多边形的Google Maps Javascript制作路径

Google Maps：如何从SVG路径创建多边形

适用于多个多边形的边界Google Maps

Google Maps图层onclick更改样式多边形

Google Maps Api将多边形更改为圆形

从 LatLng 点数组填充 Google Maps 多边形

Maps Engine多边形的坐标与Google Maps坐标不完全一样吗？

中心多边形线Google Maps插件抖动适合屏幕Google Map

将Google Maps JS API ImageMapType裁剪为多边形

Google Maps v3从MySQL数据库解码多边形

如何将React多边形元素转换为google.maps.Polygon元素

如何在Google Maps API中使用多边形字符串

Android Google Maps：绘制整个地图（选定的多边形除外）

使用Google Maps API v3相交多边形和折线

在Google Maps中使用dragListener可编辑多个多边形

在多边形中添加点会在Google Maps Android中产生星形

Google MAPS API中的多个多边形和多个标记

如何防止用户使用Google Maps图形管理器创建自相交的多边形？

Google Maps将矩形合并成一个多边形并对其进行搜索

使用Android中的Google Maps API检查点是否在多边形中

如何在Google Maps API中触发开始多边形绘图？

如何在Google Maps Javascript API中计算多个多边形的中心？

Google Maps API v3不使用多边形突出显示国家边界

在Google Maps API中获取以米为单位的多边形长度

获取多边形所有点的数组-Google Maps Drawing Tool API-3

在iOS版的Google Maps中为多边形添加文本标签

TOP 榜单

  1. 1

    隐藏发件人没有短信PHP

  2. 2

    Hashchange事件侦听器在将事件处理程序附加到事件之前进行侦听

  3. 3

    用日期数据透视表和日期顺序查询

  4. 4

    flask-admin 如何自定义删除按钮

  5. 5

    在浏览器中请求URL时会发生什么？

  6. 6

    材质UI垂直滑块。如何改变在垂直材料UI滑块导轨的厚度（反应）

  7. 7

    为什么PlusShare.Builder setRecipients方法不起作用？

  8. 8

    OS X-为什么我需要打开WiFi才能确定最近的位置

  9. 9

    在Windows 7中无法删除文件（2）

  10. 10

    android 背部按下

  11. 11

    Swift如何使用Base64Url编码JWT标头和有效负载之类的json对象

  12. 12

    PyQt4.QtCore模块无法向sip模块注册

  13. 13

    用白色图像隐藏Android Studio中的所有textView

  14. 14

    为什么随机森林中的平均降低基尼系数取决于人口规模？

  15. 15

    应用发明者仅从列表中选择一个随机项一次

  16. 16

    正则表达式，用于查找所有以任何字母开头和数字开头的文件

  17. 17

    ArgumentError：错误＃2109：在场景默认设置中未找到默认的帧标签

  18. 18

    sshd AllowGroups组未授予访问权限

  19. 19

    jQuery无限滚动固定div中的滚动

  20. 20

    无法加载文件或程序集System.Runtime.CompilerServices.Unsafe

  21. 21

    Jqgrid：多级别组摘要

热门标签

归档