2017-12-12 2 views
0

OpenLayers를 사용하여 하나의지도보기를 다른지도와 동일하게 설정하고 싶습니다. 지금까지 Zoom and Center를 사용해 보았지만 기술적으로 어느 정도 예측할 수 없었기 때문에 어느 정도 시도해 보았습니다.OpenLayers - 현재 범위까지 맞춤 축소 중

최신 OpenLayers (4.6.3)를 사용하고 있습니다.

다음 코드는 이론적으로 현재지도의 범위를 가져 와서 내지도를 해당 범위에 맞춰 이동하지 않도록해야합니다. 내가 충분히 확대하면

let view = map.getView(); 
let extent = view.calculateExtent(map.getSize()); 
view.fit(extent, map.getSize()); 

그러나 실제로

는, (예를 들어, 6 더하기 버튼을 클릭) 한 다음 위의 코드를 실행, 그것은 내가 무엇을 그냥하지 않은, 내가 그것을 실행할 때마다 축소 필요.

나는 constraintResolution을 시도했지만 피해를 최소화하고 완전히 제거하지 않았습니다. 여기

함께 연주하는 바이올린입니다 : http://jsfiddle.net/t6uvybd3/1/ (I는 OL 버전이 무엇인지 잘 모르겠지만, 그것뿐만 아니라이 일어나지 않음)

비디오 : https://www.youtube.com/watch?v=ZAV_FuZ-p7M&feature=youtu.be

+0

코드에 아무런 변화가 없습니다. –

+0

6 배 확대 했습니까? – Amit

+0

버튼과 휠을 모두 사용해 보았습니다. –

답변

1

이 일어나고 그것 때문에 범위를 맞추기 위해 해상도를 변경합니다. 지도 div의 크기를 변경하면 문제가 발생하지 않을 것입니다. 어쨌든 이것은 오픈 레이어의 오해 일지 모르지만 여기에는 임시 해결 방법이 있습니다.

var map = new ol.Map({ 
    target: 'map', 
    loadTilesWhileAnimating: true, 
    layers: [new ol.layer.Tile({source: new ol.source.OSM()})], 
    view: new ol.View({ 
     center: ol.proj.transform([0, 0], 'EPSG:4326', 'EPSG:3857'), 
     zoom: 1 
    }) 
}); 

var fitExtentAnimated = document.getElementById('fit-extent-animated'); 
fitExtentAnimated.addEventListener('click', function() { 

    let view = map.getView(); 
    let extent = view.calculateExtent(map.getSize()); 
    //hold the current resolution 
    let res = view.getResolution(); 
    //if you use older versions of ol3 use `fitExtent` istead of `fit` 
    view.fit(extent, map.getSize()); 
    //apply the resolution back 
    view.setResolution(res); 
}, false); 
+0

이것은 getResolution 만 사용하고 getResolutionForExtent는 사용하지 않는 경우에만 작동합니다. 대단히 감사합니다 – Amit

+0

걱정하지 마십시오. 도와 줘서 기뻐요! – pavlos

관련 문제