Пользовательские оверлеи в OpenLayers 3

В настоящее время я работаю над Openlayers 3.

Я использовал пользовательские оверлеи в картах Google Javascript api v3, чтобы добавить настраиваемые маркеры в виде html div на карту. И эти маркеры сгруппированы и нанесены на график в различных пользовательских оверлеях.

Сейчас я пытаюсь реализовать то же самое в OpenLayers 3, но не смог найти никакого решения, так как оверлеи в OpenLayers 3 берут один маркер в одном оверлее.

Могу ли я сгруппировать оверлеи в OpenLayers 3, чтобы сгруппировать маркеры? Или есть другие варианты?

1 ответ

У вас есть несколько возможных вариантов.

А) Если у вас есть только один набор данных, вы можете использовать StyleFunction, Посмотрите этот пример вектора ol3, более конкретно этот раздел кода:

  var vectorLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
      url: 'https://openlayers.org/en/v3.20.1/examples/data/geojson/countries.geojson',
      format: new ol.format.GeoJSON()
    }),
    style: function(feature, resolution) {
      style.getText().setText(resolution < 5000 ? feature.get('name') : '');
      return style;
    }
  });

Увидеть style имущество? Это может быть ol.style.Style или функция стиля, как показано выше. Функция получает объект и текущее разрешение вида карты в качестве аргумента и вызывается каждый раз, когда объект отображается (или повторно отображается). Возвращение ol.style.Style или массив объектов стиля будет отображать объект, используя / эти стили.

Функция может иметь уникальные свойства, т.е. feature.getProperties(), Используя столько свойств в объекте (ах), вы можете вернуть уникальный массив объектов уникального стиля.

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

Б) Если у вас есть несколько наборов данных, вы можете создать один векторный слой для каждого набора данных и определить уникальный объект стиля на слое, который будет отображать объекты одинаково.