2012-03-03 26 views
0

空或未定義的錯誤我得到這個錯誤,當我的OpenLayers調用map.AddPopup():的OpenLayers:在AddPopup

無法獲取財產「左」的價值;對象爲空或未定義

http://www.openlayers.org/api/OpenLayers.js

在Chrome和IE發生同樣的錯誤。當我將該行註釋掉時,地圖工作正常,並且標記也​​可以正常工作。後來,icon0和lonLat0將循環中的幾個項目,但我會處理。最終結果應該是某種可以顯示在標記上的文本框。

lonLat0上的標記顯示,所以它看起來不像是lonLat對象的問題。

是的,我會在最後一次顯示對他們的所有文字許多標記。我知道,這似乎很愚蠢,但這就是要求。

爲什麼addPopup會給我這個錯誤?

<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 lonLat = new OpenLayers.LonLat(-104.73,38.92).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject()); 
    var markers = new OpenLayers.Layer.Markers('Markers'); 
    map.addLayer(markers); 
    markers.addMarker(new OpenLayers.Marker(lonLat));  
    function onPopupClose(evt) {selectControl.unselect(this.feature); } 
    var icon0 = new OpenLayers.Icon("pinMS.png", new OpenLayers.Size(32,32), new OpenLayers.Pixel(-16,-32)); 
    var lonLat0 = new OpenLayers.LonLat(-104.73,38.92).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject()); 
    markers.addMarker(new OpenLayers.Marker(lonLat0, icon0.clone())); 

    // Error throws here 
    map.addPopup(new OpenLayers.Popup.FramedCloud("featurePopup", lonLat0, new OpenLayers.Size(10, 10), "<h2>Title</h2>description", null, true, onPopupClose)); 
    map.setCenter (lonLat, 1);  
</script></body></html> 

回答

2

我能夠重現你的錯誤並修復它。該演示代碼非常糟糕。我會從working example開始並對其進行修改以適應您的需求。

例如,您需要撥打<body onload="init()">上的javascript,否則我很驚訝它甚至會爲您呈現。

無論如何,我所做的就是更換map = new OpenLayers.Map('mapdiv');此:

map = new OpenLayers.Map({ 
    div: "mapdiv", 
    center: new OpenLayers.LonLat(0, 0) 
}); 

enter image description here

但這裏有一個完整的代碼櫃面你想提高你的文件的結構。

<!DOCTYPE html> 
<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <title>Open Popup on Layer.Vector</title> 
    <link rel="stylesheet" href="http://openlayers.org/dev/theme/default/style.css" type="text/css"> 
    <link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css"> 
    <script src="http://www.openlayers.org/api/OpenLayers.js"></script> 
    <script type="text/javascript"> 

     function init() { 
      map = new OpenLayers.Map({ 
       div: "mapdiv", 
       center: new OpenLayers.LonLat(0, 0) 
      }); 
      map.addLayer(new OpenLayers.Layer.OSM()); 
      var lonLat = new OpenLayers.LonLat(-104.73, 38.92).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject()); 
      var markers = new OpenLayers.Layer.Markers('Markers'); 
      map.addLayer(markers); 
      markers.addMarker(new OpenLayers.Marker(lonLat)); 
      function onPopupClose(evt) { selectControl.unselect(this.feature); } 
      var icon0 = new OpenLayers.Icon("pinMS.png", new OpenLayers.Size(32, 32), new OpenLayers.Pixel(-16, -32)); 
      var lonLat0 = new OpenLayers.LonLat(-104.73, 38.92).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject()); 
      markers.addMarker(new OpenLayers.Marker(lonLat0, icon0.clone())); 

      // Error throws here 
      map.addPopup(new OpenLayers.Popup.FramedCloud("featurePopup", lonLat0, new OpenLayers.Size(10, 10), "<h2>Title</h2>description", null, true, onPopupClose)); 
      map.setCenter(lonLat, 1); 

     } 

    </script> 
    </head> 
    <body onload="init()"> 
    <div id="mapdiv" class="smallmap"></div> 
    </body> 
</html>