OpenLayers 3'te yakınlaştırma yaparken bir özellik nasıl yeniden boyutlandırılır ve ölçeklendirilir?

Harita olarak bir görüntü ile özel bir OpenLayers 3 haritası (mahallede satılık evleri göstermek için kullanılır) başlattım.

Daha sonra, her ev için dinamik olarak ek özellikler ve katmanlar oluşturuyorum (her özelliğin çapası görüntüsünün ortası olarak ayarlanır).

sizeÖzelliği başlatırken özelliği kullanmaya çalışıyorum , ancak yaptığı şey yeniden boyutlandırma yerine görüntüyü kırpmak .

Ben resizeOL2 bir yerde katmanlar için işlev gördüm düşünüyorum , ama OL3 içinde bulamıyorum ... bu tür bir işlev istediğim sonucu elde eder misiniz?

Ayrıca, haritadan uzaklaştırıldığında özelliklerin çok büyük ölçeklendirilmesi ve çok yakınlaştırıldığında çok küçük ölçeklendirilmesi sorunu da vardır. Özelliğin koordinatlarını belirtmenin, çok büyük veya çok küçük olmasını (bir tür statik boyut) önlemek için etrafında görünmez kenar boşlukları / dolgu yapmak için bir yol var mı?

İşte özelliklerin gerçek davranışı (burada görülen özellik kara evdir): - Sonraki: Mükemmel boyut, evin uzaklaştırıldığında çok küçük olmalıdır (ilk resimde görüldüğü gibi). - Bu son resimde tekrar küçülmek yerine evin daha büyük kalması gerekiyordu. .

Sanırım bir ol.style.Icon. simge görüntüsünü ölçeklemek için kullanabileceğiniz ol.style.Iconbir scale seçenek vardır.

Örneğin, bir görüntüyü küçültmek istiyorsanız şöyle bir şey kullanırsınız:

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

Şimdi, scalegeçerli çözünürlüğe bağlı olarak farklı değerler istiyorsanız , vektör katmanına bir stil işlevi iletebilirsiniz:

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

Optimizasyon olarak, yukarıdaki kodun , stil işlevinin her çağrılışında nesnelerin oluşturulmasını önlemek için ol.style.Iconnesneyi, ol.style.Stylenesneyi ve stil dizisini yeniden kullandığını unutmayın .