Jak usunąć dane z gmap?

Question

Widzę, że Google Maps obsługuje geojsona. Patrząc na docs tutaj: https://developers.google.com/maps/documentation/javascript/datalayer#load_geojson

Biorąc pod uwagę ostatni przykład z „Google”, w jaki sposób mogę to zrobić tak, że mogę kliknąć przycisk, aby dodać nową warstwę GeoJSON, a inny przycisk, aby włączyć/usunąć " Google ", a nawet list? Wydaje mi się, że map.data wydaje się być pojedynczą warstwą i nie ma wielu warstw.

Answer 1

Masz rację, ponieważ warstwa danych to pojedyncza warstwa. Jednakże, jeśli ręcznie pobierzesz GeoJSON i użyjesz funkcji addGeoJson zamiast loadGeoJson, otrzymasz dodane funkcje. Możesz je później usunąć.

Więc zamiast

map.data.loadGeoJson('https://storage.googleapis.com/maps-devrel/google.json'); 

można zrobić coś takiego (przykład ten wykorzystuje jQuery, aby uzyskać dane i zakłada, znajduje się przycisk z ID removeBtn):

// Load the GeoJSON manually (works cross-origin since google sets the required HTTP headers) 
$.getJSON('https://storage.googleapis.com/maps-devrel/google.json', function (data) { 
    var features = map.data.addGeoJson(data); 

    // Setup event handler to remove GeoJSON features 
    google.maps.event.addDomListener(document.getElementById('removeBtn'), 'click', function() { 
    for (var i = 0; i < features.length; i++) 
     map.data.remove(features[i]); 
    }); 
}); 

(See this JSbin for a working example you can play around with)

W bardziej złożonych okolicznościach prawdopodobnie musisz śledzić, które źródło danych załadował użytkownik i jakie funkcje zostały utworzone z tego powodu. można je usunąć na żądanie.

Answer 2

Podczas map.data jest zaprojektowany jako zastępczy dla wspólnego przypadku pojedynczego źródła danych, można mieć wiele, i nadal korzystać addGeoJSon użyciu coś jak:

// load data - do the same for data2, data3 or whatever 
data1 = new google.maps.Data(); 
data1.loadGeoJson(url1); 

// create some layer control logic for turning on data1 
data1.setMap(map) // or restyle or whatever 

// turn off data1 and turn on data2 
data1.setMap(null) // hides it 
data2.setMap(map) // displays data2 

Answer 3

ten pracował dla mnie:

map.data.forEach(function(feature) { 
    // filter... 
    map.data.remove(feature); 
});