Jak zmienić rozmiar funkcji i zapobiec skalowaniu podczas powiększania w OpenLayers 3

Zainicjowałem niestandardową mapę OpenLayers 3 (używaną do pokazywania domów na sprzedaż w sąsiedztwie) z obrazem jako mapą.

Następnie dynamicznie tworzę dodatkowe elementy i warstwy dla każdego domu (kotwica każdego elementu jest ustawiana jako środek jego obrazu).

Próbowałem użyć tej sizewłaściwości podczas inicjowania funkcji, ale powoduje ona przycięcie obrazu zamiast zmiany jego rozmiaru.

Myślę, że widziałem resizefunkcję warstw gdzieś w OL2, ale nie mogę jej znaleźć w OL3 ... czy tego rodzaju funkcja osiągnęłaby pożądany przeze mnie wynik?

Istnieje również problem polegający na tym, że funkcje skalują się o wiele za daleko, gdy są pomniejszane z mapy, a skalują się za małe, gdy są bardzo powiększane. Czy istnieje sposób na określenie współrzędnych obiektu, a następnie wykonanie jakiegoś niewidocznego marginesu / wypełnienia wokół niego, aby nie stał się zbyt duży lub zbyt mały (jakiś rodzaj wielkości statycznej)?

Oto rzeczywiste zachowanie funkcji (widoczna tutaj funkcja to czarny dom): - Dalej: Idealny rozmiar, dom powinien być jednak znacznie mniejszy po pomniejszeniu (jak widać na pierwszym zdjęciu). - Dom powinien był pozostać większy, zamiast zmniejszać na tym ostatnim zdjęciu. .

Zakładam, że używasz ol.style.Icon. ol.style.Iconma scale opcję , której można użyć do skalowania obrazu ikony.

Na przykład, jeśli chcesz przeskalować obraz, użyjesz czegoś takiego:

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

Teraz, jeśli chcesz mieć różne scalewartości w oparciu o bieżącą rozdzielczość, możesz przekazać funkcję stylu do warstwy wektorowej:

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;
  })
});

Zauważ, że jako optymalizacja powyższy kod ponownie wykorzystuje ol.style.Iconobiekt, ol.style.Styleobiekt i tablicę stylów, aby uniknąć tworzenia obiektów przy każdym wywołaniu funkcji stylu.