Как удалить данные из слоя данных Карт Google?

Я вижу, что Google Maps поддерживает geojson. Глядя на документы здесь: https://developers.google.com/maps/documentation/javascript/datalayer#load_geojson

Учитывая последний пример с "Google", как я могу сделать так, чтобы я мог нажать кнопку, чтобы добавить новый слой Geojson, и еще одну кнопку для переключения/удаления "Google" или даже письма? Мне кажется, что map.data представляется одним слоем и не является несколькими слоями.

Ответы

Ответ 1

Вы правы в том, что слой данных является одним слоем. Однако, если вы вручную извлечете GeoJSON и используете функцию addGeoJson вместо loadGeoJson, вы получите возвращаемые дополнительные функции. Вы можете удалить их позже.

Итак, вместо

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

Вы можете сделать что-то подобное (этот пример использует jQuery для получения данных и предполагает наличие кнопки с идентификатором 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]);
  }); 
});

(См. этот JSbin для рабочего примера, с которым вы можете играть с)

В более сложных условиях вам, вероятно, придется отслеживать, какой источник данных загружен пользователем, и созданные функции из-за этого, поэтому вы можете удалить их по запросу.

Ответ 2

Это сработало для меня:

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

Ответ 3

В то время как map.data предназначен как местозаполнитель для общего случая одного источника данных, вы можете использовать несколько и использовать addGeoJSon, используя что-то вроде:

// 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

Ответ 4

В качестве ответа на ответ @mensi может быть важно отслеживать различные наборы функций, загруженных из разных источников данных. Вы можете сделать это, добавив свойство к каждой функции:

feature.setProperty('kind', 'region');
feature.setProperty('kind', 'lake');

Однако может быть проще создать несколько слоев данных. Карта Google по умолчанию начинается с одного слоя данных, но вы не ограничены этим. Ты можешь сделать:

var datalayer = new google.maps.Data({ map: mymap });

(Важно установить параметр map, иначе слой данных не будет отображаться.)

Таким образом, будет проще группировать объекты по слоям и включать или выключать целые слои.