2

I'm trying to replicate an example from the OpenLayers Examples, specifically this one: http://openlayers.org/en/v3.0.0/examples/animation.html

The problem is that in my jsfiddle I cannot get all the buttons to work properly. For some reason the rotate buttons work but all the other ones do not. My fiddle is right here; http://jsfiddle.net/TimLucas/m6cju630/1/

It seems to be a problem with some view.setCenter since this is the only thing different in the functions calling the other buttons ('rotate to Madrid', etc.). I was searching for other examples where this function does work, but I cannot find any differences between the function in my fiddle that does not work and fiddles that do seem to get this functionality working (such as http://jsfiddle.net/ygtxwodL/). Can anyone see what I am doing wrong?

I am rather new to JavaScript so apologies for any obvious mistakes.

2

You need to change the scope of your view so it's available to those listener events. Just make a the view global by declaring it outside the Map definition.

See http://jsfiddle.net/4gjhwbne/

i.e. change

var map = new ol.Map({
  target: 'map',
  layers: [
    new ol.layer.Tile({
      source: new ol.source.MapQuest({layer: 'osm'})
    })
  ],
  view: new ol.View({
    center: amsterdam,
    zoom: 10
  })
});

to

var view = new ol.View({
    center: amsterdam,
    zoom: 10
  });

var map = new ol.Map({
  target: 'map',
  layers: [
    new ol.layer.Tile({
      source: new ol.source.MapQuest({layer: 'osm'})
    })
  ],
  view: view
});

P.S. try using some browser developer tools, like Firebug or Chrome's developer tools to see what's going on

  • Thanks! That worked! And I will use the developer tools next time! Helps a lot too! – Tim.Lucas Dec 23 '14 at 16:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.