OpenLayers is not adding marker to my map

Question

I have an OpenLayers map and I create it using a JavaScript function. I then have a button which when pressed calls another JavaScript function which has code to add a marker to the map.

For some reason the marker is not added.

Code for OpenLayers map creation:

function init()
    {
        var map, baseLayer;
        var options = {numZoomLevels: 5, isBaseLayer: true,};

        map = new OpenLayers.Map('map');            
        baseLayer = new OpenLayers.Layer.Image("My map","map.png", 
        new OpenLayers.Bounds(-2000, -2000, 1000, 1000),
        new OpenLayers.Size(1500,1500), options);
        map.addLayer(baseLayer);
        var center = new OpenLayers.LonLat(-100,-100);
        map.setCenter(center ,0);  
        map.addControl(new OpenLayers.Control.LayerSwitcher());
        map.addControl(new OpenLayers.Control.MousePosition());
        var size = new OpenLayers.Size(21,25);
        var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
        var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png',size,offset);
        var markers = new OpenLayers.Layer.Markers( "Marker" );
        map.addLayer(markers);
    }

Code for adding marker:

function addMarker(x, y)
    {    
        markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(x, y),icon));
    }

Any help is much appreciated :)

variables "markers" and "icon" are visible inside the function "addMarker"? — Maxi Baez
– Maxi Baez, Commented Apr 16, 2013 at 18:44

Maxi Baez · Accepted Answer · 2013-04-16 19:46:37Z

2

This works fine for me :

var markers,icon;
function init(){
    var map, baseLayer;
    var options = {numZoomLevels: 5, isBaseLayer: true,};

    map = new OpenLayers.Map('map');            
    baseLayer = new OpenLayers.Layer.Image("My map","map.png", 
    new OpenLayers.Bounds(-2000, -2000, 1000, 1000),
    new OpenLayers.Size(1500,1500), options);
    map.addLayer(baseLayer);
    var center = new OpenLayers.LonLat(-100,-100);
    map.setCenter(center ,0);  
    map.addControl(new OpenLayers.Control.LayerSwitcher());
    map.addControl(new OpenLayers.Control.MousePosition());
    var size = new OpenLayers.Size(21,25);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    //instance the icon
    icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png',size,offset);
    //instance the marker layer
    markers = new OpenLayers.Layer.Markers( "Marker" );
    map.addLayer(markers);
}

function addMarker(x, y){    
    markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(x, y),icon));
}

answered Apr 16, 2013 at 19:46

Maxi Baez

5785 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user1702401 Over a year ago

That's correct. To explain it: icon and markers were local variables in init() and were not accessible in addMarker. In Maxi's code, those two variables are moved to global scope.

Collectives™ on Stack Overflow

OpenLayers is not adding marker to my map

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related