地理位置：使用OpenStreetMap繪圖和POI

我正在製作一個網站，訪問者在地圖上顯示位置並在選定的半徑（例如10公里）內顯示訪問者可以看到一些POI（例如餐館，酒吧）。地理位置：使用OpenStreetMap繪圖和POI

我到目前爲止這樣的代碼：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
     <style type="text/css"> 
      html { height: 100% } 
      body { height: 100%; margin: 0; padding: 0 } 
      #map_canvas { height: 100% } 
     </style> 
     <script type="text/javascript" 
       src="http://maps.googleapis.com/maps/api/js?key=[MY_KEY]&sensor=false"> 
     </script> 
     <script type="text/javascript"> 
      function init() 
      { 
       if(navigator.geolocation) 
       { 
        navigator.geolocation.getCurrentPosition (processPosition, handleError); 
       } 
       else 
       { 
        alert("Geolocation not supported in this browser"); 
       } 
      } 

      function processPosition(pos) 
      { 
       var latlng = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude); 

       var myOptions = { 
        center: latlng, 
        zoom: 16, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }; 
       var map = new google.maps.Map(document.getElementById("map_canvas"), 
       myOptions); 

       var marker = new google.maps.Marker({ 
        position: latlng, 
        map: map, 
        title:"You are here! (at least within a "+pos.coords.accuracy+" meter radius)" 
       }); 
      } 

      function handleError(err) 
      { 
       alert('An error occurred: ' + err.code); 
      } 

     </script> 
    </head> 
    <body onload="init()"> 
     <div id="map_canvas" style="width:100%; height:100%"></div> 
    </body> 
</html>

它顯示了我，我用谷歌地圖標記在地圖上的位置。
事情是，我想使用來自OpenStreetMap的地圖（它們定期更新並且沒有限制），但不幸的是我還沒有設法實現它。

這裏有我需要的地圖：Maps

1.是否有一個例子（教程），它展示瞭如何使用他們的API，如Google的？
2. OpenStreetMap有類似POI的東西，比如Google Places？或者甚至可以將Google Places與OpenStreetMap的地圖一起使用？

來源

2012-02-29 Evgeni Reznik

如果你想使用OpenStreetMap數據，你應該看看OpenLayers。這與Google Maps或Bing Maps API有點不同：您必須在您的服務器上安裝OpenLayers JavaScript庫，並負責顯示可能來自各種來源的地圖數據（「地圖切片」）：OpenStreetMap （OSM），Google地圖，您自己的自定義地圖數據等。OpenStreetMap website本身使用OpenLayers來顯示地圖。

1：有documentation很多（雖然我恐怕不太對谷歌地圖API一樣好）和examples，包括一些使用OpenStreetMap的數據，單獨或夥同谷歌的數據（在輸入「OSM」頂部的「過濾器」框）。

2：至於POI，您可以在地圖上放置一個"Marker Layer"，如this example，包括點擊圖標時出現的可定製標記圖標和氣泡，但您必須處理POI的數據和搜索功能自己。因此，如果您願意，您可以自由使用Google Places API，然後在OpenStreetMap上將結果顯示爲標記 - 只要您使用「Powered by Google」標誌即可。

來源

2012-03-06 00:29:10 rob74

我不會花時間開發任何使用Google技術的應用程序，除非您的應用程序產生足夠的收入以支付Google地圖服務。 – 2012-07-10 11:55:20

不允許在OSM地圖上顯示Google地方信息：「如果您的應用程序在地圖上顯示地圖API數據，則該地圖必須由Google提供。」（https://developers.google.com/places/policies） – 2012-12-13 14:40:07

從openstreetmap.org，與所謂的「webmaps」名單上的特別通知所有OSM框架的名單，因爲它涉及到你的問題：http://wiki.openstreetmap.org/wiki/Frameworks#Webmaps

的nJoy！

來源

2013-06-14 18:57:17

地理位置：使用OpenStreetMap繪圖和POI

回答

相關問題