Leaflet / Leaflet.toolbar

Flexible, extensible toolbars for Leaflet maps.
MIT License
197 stars 70 forks source link

leaflet beta 1 #29

Closed ivanmobigis closed 7 years ago

ivanmobigis commented 9 years ago

Hi there,

Does tool work with Leaflet 1b ? I'm getting:

TypeError: Cannot read property 'call' of undefined
    at L.Map.L.Evented.extend.whenReady (leaflet-src.js:2331)
    at L.Map.include.addLayer (leaflet-src.js:2510)
    at L.Toolbar.L.Class.extend.addTo (leaflet.toolbar-src.js:26)
    at mapController.js:286
    at angular.min.js:120
    at n.$get.n.$eval (angular.min.js:134)
    at n.$get.n.$digest (angular.min.js:132)
    at n.$get.n.$apply (angular.min.js:135)
    at l (angular.min.js:87)
    at F (angular.min.js:91)

whereby the L.Toolbar.Control object doesn't have a ._layerAdd callback on it. Adding an empty function just uncovers a new error. Am i on uncharterted / unsupported waters ?

thanks

-i

IvanSanchez commented 9 years ago

@yohanboniface has been working on Leaflet 1.0 compatibility, see https://github.com/yohanboniface/Leaflet.toolbar/tree/leaflet1.0-compat . If you can, try reproducing this bug with the code from that branch.

ivanmobigis commented 9 years ago

no problem, the 'minimal' example shows the same problem (i had started from there ;)).. makes me think i'm doing something wrong ?

hope this helps,

-i

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="http://leaflet.github.io/Leaflet.toolbar//node_modules/leaflet/dist/leaflet.css" />
    <link rel="stylesheet" href="http://leaflet.github.io/Leaflet.toolbar/dist/leaflet.toolbar.css"/>

    <script src="//cdn.leafletjs.com/leaflet-1.0.0-b1/leaflet-src.js"></script>
    <script src="http://leaflet.github.io/Leaflet.toolbar/dist/leaflet.toolbar-src.js"></script>

    <style>
        html, body, #map { margin: 0; height: 100%; width: 100%; }
    </style>
</head>
<body>
    <div id="map"></div>
    <script>
        var map = L.map('map').setView([41.7896, -87.5996], 15);

        L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
            attribution: '<a href="http://openstreetmap.org/copyright">OpenStreetMap Contributors</a>'
        }).addTo(map);

        var MyCustomAction = L.ToolbarAction.extend({

            options: {
                toolbarIcon: {
                    html: '&#9873;',
                    tooltip: 'Go to the Eiffel Tower'
                }
            },

            addHooks: function () {
                map.setView([48.85815, 2.29420], 19);
            }

        });

        new L.Toolbar.Control({
            actions: [MyCustomAction]
        }).addTo(map);
    </script>
</body>
</html>
ivanmobigis commented 9 years ago

eek, i realise in my example above i reference the 'trunk' leaflet, but i get the same error when referencing the yohanboniface/Leaflet.toolbar branch code, i just don't have a publically-visible link to the js i can use.

Uncaught TypeError: Cannot read property 'call' of undefined
L.Map.L.Evented.extend.whenReady @ leaflet-src.js:2331
L.Map.include.addLayer @ leaflet-src.js:2510
L.Toolbar.L.Class.extend.addTo @ leaflet.toolbar-src.js:26(anonymous function) @ foo.html:40
justinmanley commented 7 years ago

Fixed with https://github.com/justinmanley/leaflet-draw-toolbar.