0
core.mjs:6484 ERROR TypeError: Cannot read property 'topright' of undefined
    at NewClass.addTo (leaflet-src.js:4759)
    at SafeSubscriber._next (tab2.page.ts:132)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)
    at SafeSubscriber.next (Subscriber.js:122)
    at Subscriber._next (Subscriber.js:72)
    at Subscriber.next (Subscriber.js:49)
    at Subject.next (Subject.js:39)
    at GlobalFooService.publishSomeData (global-foo.service.ts:12)
    at Tab1Page.buttonClick (tab1.page.ts:57)
    at Tab1Page_ion_item_11_Template_ion_item_click_0_listener (template.html:19)
core.mjs:6484 ERROR TypeError: Cannot read property '_removePath' of undefined
   at NewClass.onRemove (leaflet-src.js:7817)
    at NewClass.removeLayer (leaflet-src.js:6642)
    at NewClass.eachLayer (leaflet-src.js:6856)
    at NewClass.onRemove (leaflet-src.js:6844)
    at NewClass.removeLayer (leaflet-src.js:6642)
    at NewClass._clearLines (leaflet-routing-machine.js:16186)
    at NewClass.<anonymous> (leaflet-routing-machine.js:16163)
    at NewClass.<anonymous> (leaflet-routing-machine.js:18004)
    at XMLHttpRequest.loaded [as __zone_symbol__ON_PROPERTYload] (leaflet-routing-machine.js:46)
    at XMLHttpRequest.wrapFn (zone.js:803)

当我将大部分代码放在我的leafletMap() 函数中的订阅异步中时,就会发生这种情况。如果我取出路由控制代码,则会发生一系列其他错误,这些错误将导致编译失败。如何处理这些错误,我需要订阅异步以从我的 Ionics 选项卡项目中的另一个选项卡中获取数据,以便选择酒店。

leafletMap() {    
        // Set the position and zoom level of the map
        this.map = L.map('mapId', {
            closePopupOnClick: false,
            scrollWheelZoom: false
        }).setView([<!-- default coordinates -->], 17);

        // Initialize the base layer
        L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
            maxZoom: 19
        }).addTo(this.map);

        this.globalFooService.getObservable().subscribe((data) => {
            var hotelNames = [];
            for(var c = 0; c < this.hotelItems.length; c++) {
                hotelNames.push(this.hotelItems[c].name);
            }
            var opt = 0;
            opt = hotelNames.indexOf(data) + 1;

            var coordinate = [];
            for(var a = 0; a < this.pointItems.length; a++) {
                coordinate.push(L.latLng(this.pointItems[a].coordinates));
            }
            var names = []
            for(var a = 0; a < this.pointItems.length; a++) {
                names.push(this.pointItems[a].name);
            }
            var route = [];
            var spots = [];

            if(opt > 0) {
                route.push(this.hotelItems[opt - 1].coordinates);
                var n = Number.MAX_VALUE;
                var sort = [];

                for (var i = 0; i < 7; i++) {
                    for(var x = 0; x < coordinate.length; x++) {
                        sort.push(coordinate[x].distanceTo(route[i]));
                    }

                    for(var y = 0; y < sort.length; y++) {
                        if(sort[y] < n) {n = sort[y];}
                    }

                    for(var z = 0; z < coordinate.length; z++) {
                        if(coordinate[z].distanceTo( route[i]) == n) {
                            route.push(coordinate[z]);
                            spots.push(names[z]);
                            coordinate.splice(z, 1);
                            names.splice(z, 1);
                            break;
                        }
                    }

                    while( sort.length > 0 ) {sort.pop();}

                    n = Number.MAX_VALUE;
                 }

                 const control = L.Routing.control({
                    waypoints: route,
                    show: false,
                    waypointMode: 'snap',
                    createMarker: function() {}
                 }).addTo(this.map);
                 control.on('routeselected', function(c) {
                    this.path = L.polyline(c.route.coordinates, {color: '#FF0000'}).addTo(this.map);
                    this.map.removeControl(control);
                 });

                const popup = L.popup().setLatLng(route[0]).setContent("You will be staying at " + this.hotelItems[opt - 1].name + ". Tap the hotel marker to save your journey.");
                this.map.addLayer(popup);
                this.hotel = L.marker().setLatLng(route[0]).addTo(this.map);

                for( var m = 1; m < route.length; m++ ) {
                    this.markers.push(
                        L.marker().setLatLng(route[m]).addTo(this.map)
                    );
                    this.popups.push(
                        L.popup().setLatLng(route[m]).setContent(spots[m - 1])
                    );
                    this.map.addLayer(this.popups[m - 1]);
                }
             }
        });
    }
4

0 回答 0