OpenLayers: пустая или неопределенная ошибка в AddPopup - PullRequest
Новая
       22

OpenLayers: пустая или неопределенная ошибка в AddPopup

0 голосов
/ 03 марта 2012

Я получаю эту ошибку при вызове map.AddPopup () в OpenLayers:

Невозможно получить значение свойства 'Left';объект является нулевым или неопределенным

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>

1 Ответ

2 голосов
/ 05 марта 2012

Я смог воспроизвести вашу ошибку и исправить ее. Этот демонстрационный код действительно плох. Я бы начал с рабочего примера и изменил бы его под свои нужды.

Например, вам нужно вызвать свой javascript на <body onload="init()">, иначе я удивлюсь, что он вам даже поможет.

Во всяком случае, все, что я сделал, заменили 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>
...