Як змінити розмір функції та запобігти її масштабуванню під час збільшення масштабів у OpenLayers 3

Я ініціалізував власну карту OpenLayers 3 (використовується для показу будинків для продажу в околицях) із зображенням у вигляді карти.

Потім я створюю додаткові функції та шари динамічно для кожного будинку (якор кожної функції встановлюється як середина його зображення).

Я намагався використовувати sizeвластивість під час ініціалізації функції, але те, що вона робить, - це обрізати зображення, а не змінювати його розмір.

Я думаю, що я бачив resizeфункцію для шарів десь в OL2, але я не можу її знайти в OL3 ... чи вдасться такої функції досягти бажаного результату?

Існує також проблема в тому, що можливості масштабування занадто великі при зменшенні масштабу з карти, а також зменшення масштабування при малому масштабі. Чи є спосіб вказати координати функції, а потім зробити якісь невидимі поля / прокладки навколо неї, щоб запобігти занадто великому або занадто малому (якийсь статичний розмір)?

Ось фактична поведінка особливостей (особливість, яку бачимо тут чорний будинок): - Далі: Ідеальний розмір, будинок повинен бути набагато меншим, коли зменшується масштаб (як видно на першому малюнку). - Будинок повинен був залишитися більшим, замість того, щоб знову зменшити масштаб на цій останній фотографії. .

Я припускаю, що ви використовуєте ol.style.Icon. ol.style.Iconє scale опція, яку ви можете використовувати для масштабування зображення значка.

Наприклад, якщо ви хочете зменшити масштаб зображення, ви використовуєте щось подібне:

var style = new ol.style.Style({
  image: new ol.style.Icon({
    url: 'http://example.com/icon.png',
    scale: 0.5,
    // …
  })
});

Тепер, якщо вам потрібні різні scaleзначення на основі поточної роздільної здатності, ви можете передати функцію стилю векторному шару:

var iconStyle = new ol.style.Icon({
  url: 'http://example.com/icon.png',
  // …
});

var styles = [new ol.style.Style({
  image: iconStyle
})];

var vectorLayer = new ol.layer.Vector({
  source: new ol.source.Vector(),
  style: function(feature, resolution) {
    // "func" is your function that gives you a scale for a resolution
    var scale = func(resolution);
    iconStyle.setScale(scale);
    return styles;
  })
});

Зауважте, що в якості оптимізації вищевказаний код повторно використовує ol.style.Iconоб'єкт, ol.style.Styleоб’єкт та масив стилів, щоб уникнути створення об'єктів щоразу, коли викликається функція стилю.