时间戳

首页 > 解决方案 > 如何从openstreetmap获取坐标

javascript - 如何从openstreetmap获取坐标

问题描述

当我单击地图以输入地址字段时，我正在尝试获取坐标。我不知道在我的函数中放入什么来获取有关位置的信息！

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script type="text/javascript" 
src="http://openlayers.org/api/2.11/OpenLayers.js"></script>
<script type="text/javascript" >
var myMap;

function loadOpenLayers(){  

myMap = new OpenLayers.Map("mymap", {});

var wms = new OpenLayers.Layer.WMS(
"OpenLayers WMS",
"http://vmap0.tiles.osgeo.org/wms/vmap0",
{layers: "basic"},
{});

myMap.addLayer(wms);

myMap.setCenter(new OpenLayers.LonLat(-122.349243, 47.651743));

myMap.zoomTo(6);   
myMap.on('click', function(event) {
 document.getElementById("demo").innerHTML = "Hello World";

});
} 

</script>
</head>
<body onload="loadOpenLayers();">
<div id="mymap" style="width: 620px; height: 460px; border: 1px solid;">
<p id="demo">
</div>

</body>
</html>

标签： javascriptopenlayersopenstreetmap

解决方案

您正在混淆 OpenLayers 2 和 OpenLayers 3+ 代码。 myMap.on('click', function(event) {是OL3+。如果您必须使用 OpenLayers 2，您需要

document.getElementById("mymap").onclick = function(event) {
  var lonlat = myMap.getLonLatFromPixel(new OpenLayers.Pixel(event.clientX, event.clientY));
  document.getElementById("demo").innerHTML = lonlat.lon + ' ' + lonlat.lat;
};

但是如果您正在开始一个新项目，最好使用最新的 OpenLayers 5 重新开始。

推荐阅读