Daha çox

Leaflet markerClusterGroup 'təyin olunmayan bir funksiya deyil'


Bir geojsondan 5000-dən çox bal olan bir xəritə yaratmalıyam. Beləliklə, Leaflet ilə markercluster plaginindən istifadə etmək istəyirəm.

Sənədlərdən və digər yazılardan kömək alaraq aşağıdakı kodu yazdım (veb xəritələşdirmə və proqramlaşdırma dillərinə yeni başlamışam) və xrom konsol, leaflet.markercluster.js faylı üçün "L təyin olunmadığını" və "təyin olunmamışdır L.markerClusterGroup () kod kodum üçün bir funksiya deyil ".

Kod budur:

var clusterGroup = yeni L.markerClusterGroup (); var points = L.geoJson (gares, {pointToLayer: function (feature, latlng) {return L.marker (latlng) .bindPopup (feature.properties.NOM);}}); clusterGroup.addLayer (nöqtələr); map.addLayer (clusterGroup);

Niyə işləmədiyini anlamağımda kömək edəcək birisi varmı?


Əsas broşura tətbiqini yüklədikdən sonra markercluster plaginini yükləyən skript əlavə etməlisiniz. Markercluster funksionallığı Leaflet-in genişləndirilmiş / yeni siniflərinə əsaslanır, buna görə əvvəlcə Leaflet oxumalıdır. Beləliklə, bu sətri qoyun:

Bundan sonra:


'broşuradan' L olaraq idxal *; 'leaflet.markercluster' from L1 olaraq idxal * this.map = L.map ('map', {center: [51.5, -0.09], zoom: 3}); const plitələr = L.tileLayer ('https: // {s} .tile.openstreetmap.org / {z} / {x} / {y} .png ">

Açısal 8 ilə işləmək məcburiyyətində qaldım:

Əlavə etcssjsfayllarıangular.json:

"stillər": ["node_modules / leaflet / dist / leaflet.css", "node_modules / leaflet.markercluster / dist / MarkerCluster.css", "node_modules / leaflet.markercluster / dist / MarkerCluster.Default.css"], "scripts ": [" node_modules / leaflet / dist / leaflet.js "," node_modules / leaflet.markercluster / dist / leaflet.markercluster.js "]

Mənimkomponent.ts, İdxal etməli idimvərəqəəvvəlvərəqə. markerkluster:

'broşuradan' L olaraq idxal *; 'broşura.markercluster'dan L1 olaraq idxal *;

Nəhayət yarada bildimMarkerClusterGroupobyekt istifadə edirL1ilə digər ad və digər broşura obyektləriL. Mənim üçün işləyən nümunə:

var markersCluster = yeni L1.MarkerClusterGroup (); var my_marker = L.marker ([43.607378, 1.429010]); markersCluster.addLayer (my_marker);

@Anonym-in cavabına bənzəyir, lakin yoxdur**ətrafındaL1takma ad.


Bu, açısal, idxalatı aşağıdakılara dəyişdirərək sadə idxal səhvidir, bu məsələni həll edir:

'broşuradan' L olaraq idxal *; idxal 'broşura.markercluster'; // Compile & run = OK private myClusterGroup = L.markerClusterGroup ();

Açısal 7, broşura 1.6.0 və broşura.markercluster 1.4.1 istifadə edərək test edilmişdir


Markercluster.js faylının istinadını itirdiyinizə görədir. @Alexandru qeyd etdiyi kimi markercluster.js istinadını əlavə etməlisiniz.

CSS üçün CSS marker klasterini də əlavə etməlisiniz.

@ * yükləmə xəritəsi * @   @ * yük marker qrupları * @   


Videoya baxın: DİM X FUNKSİYA ANLAYIŞI TEST C-D (Oktyabr 2021).