簡體   English   中英

OpenLayers添加標記和彈出窗口

[英]OpenLayers add Marker and Popup

我在使用OpenLayers時遇到麻煩。 我的工作代碼是:

<html><body>
  <div id="mapdiv"></div>
  <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
  <script>
    map = new OpenLayers.Map("mapdiv");
    map.addLayer(new OpenLayers.Layer.OSM());

    //var results = new OpenLayers.Layer.Text("My Points", { location:"./checkIns_0_view.txt", projection: map.displayProjection});
    //map.addLayer(results);

    var query = new OpenLayers.LonLat(-122.2928337167, 37.5549570333).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
    var markers = new OpenLayers.Layer.Markers("Markers");
    map.addLayer(markers);
    var size = new OpenLayers.Size(21,25);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    var icon = new OpenLayers.Icon('http://openlayers.org/dev/img/marker-blue.png', size, offset);
    marker = new OpenLayers.Marker(query, icon);
    markers.addMarker(marker);

    var zoom=16;
    map.setCenter (query, zoom);
  </script>
</body></html>

現在,我想添加一些信息的彈出窗口。 我嘗試使用幾個示例,例如http://openlayers.org/dev/examples/osm-marker-popup.html 我想添加如下內容:

    var popup = new OpenLayers.Popup.FramedCloud("Popup", query, null, "Text", true);
    map.addPopup(popup);

第一行可以編譯,但是當我添加第二行時,瀏覽器不會顯示我的地圖。 我認為這可能與query-lonLat有關,但是我沒有必要的OpenLayers技能來查找。

我非常希望得到一個答案。

問候

  1. 根據OpenLayers文檔 ,您會在彈出構造器中缺少“ Text”true之間的定位參數 可能這就是問題的根源。 在彈出窗口的示例中,此參數的值為空

     var popup = new OpenLayers.Popup.FramedCloud("Popup", myLocation.getBounds().getCenterLonLat(), null, 'We ' + 'could be here. Or elsewhere.', null, true // true if we want a close (X) button, false otherwise ); 

    在您的情況下,可以使用變量圖標代替空值。

  2. 在函數map.addPopup(popup)中,您還應該具有第二個參數獨占 見的OpenLayers文檔dev.openlayers.org/docs/files/OpenLayers/Map-js.html#OpenLayers.Map.addPopup或該方法的定義在這里 我認為使用所有定義的參數是一個好習慣,因為它經常會引起問題。

希望在添加所有參數之后它可以工作。 您的工作彈出窗口代碼:

var popup = new OpenLayers.Popup.FramedCloud("Popup", query, null, "Text", null, true);
map.addPopup(popup, false);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM