Search code examples
javascriptconsoleleafletweb-console

Access methods of existing Leaflet map on a website

I'd like to flyTo() on an existing map on http://leaflet-extras.github.io/leaflet-providers/preview/

When I type map into Firefox's (or Vivaldi's/Chromium's) web console, the <div> container is returned. How can I get the JS map variable to be able to call map.flyTo(<LatLng>)?

Solution

  • Welcome to SO!

    Unfortunately, the Leaflet Map initialization, on the demo page you link to, happens in a JavaScript IIFE, i.e. in a local self-contained scope:

    https://github.com/leaflet-extras/leaflet-providers/blob/8833ac605c3e64da58700a79a75eca01463e7afe/preview/preview.js#L4

    (function() {
  'use strict';

  var map = L.map('map', {
    zoomControl: false,
  }).setView([48, -3], 5);

  // more code...

})(); // End of IIFE

    Therefore you will not be able to access that local map variable from an outer scope, i.e. from the window you have access to on your browser web console.

    I am also not aware of a mean to retrieve the Map object from its DOM container by default in Leaflet.