2016-12-08 83 views
0

我正在使用openlayers創建一個身體的地圖。它顯示了一個人的mri掃描有很多標記。openlayers 3:不要放大圖像

完全縮小,有很多空白(或者在我的情況下,黑色空間背景是黑色)我已經設置了帶有extent參數的openlayers,因此用戶無法進一步平移而不是圖像很大。 但是當用戶將鼠標懸停在其周圍的空白處並滾動以進行縮放時,圖像將根據光標的位置放大,因此身體不在視野中。一旦用戶再次開始平移,程序就會播放並跳回到圖像的邊緣。

有沒有辦法在遊標超出範圍時禁用放大/縮小?或者如果這是不可能的,我怎樣才能觸發一個移動/平移,所以它會自動跳轉到圖像的邊緣?

編輯14/12/2016:創建一個JSFiddle來說明問題。

,這是有運行代碼:

var pbm = {}; 
pbm.vars = {}; 

pbm.vars.extent = [0, 0, 1536, 5120]; 
pbm.vars.projection = new ol.proj.Projection({ 
    code: 'xkcd-image', 
    units: 'pixels', 
    extent: pbm.vars.extent 
}); 

/** 
* initMap 
* -------- 
* triggered by pbm.parseCases! 
* outputs the bodymap to the #body-div 
* this functions needs all the other ol-elements to work! 
*/ 
pbm.initMap = function(){ 
    pbm.map = new ol.Map({ 
    layers: [ 
     new ol.layer.Image({ 
     source: new ol.source.ImageStatic({ 
      url: 'https://s3-eu-west-1.amazonaws.com/norvell-philips/bodymap-static-hiress.jpg', 
      projection: pbm.vars.projection, 
      imageExtent: pbm.vars.extent 
     }) 
     }) 
    ], 
    target: 'body',//Div#body 
    view: new ol.View({ 
     projection: pbm.vars.projection, 
     center: ol.extent.getCenter(pbm.vars.extent), 
     zoom: 2, 
     maxZoom: 5, 
     minZoom: 1, 
     extent: pbm.vars.extent 
    }), 
    renderer: 'canvas', 
    controls: ol.control.defaults({attribution:false, rotate: false, zoom:false}), 
    interactions: pbm.vars.interactions 
    }); 
} 

$(document).ready(function(){ 
    pbm.initMap(); 
}); 
+0

創建一個plunker示例。它會幫助我們解決你的問題? –

+0

我已經添加了一些代碼和jsfiddle示例 –

回答

0

這是最近修正了一個錯誤。包含修復程序的第一個版本將是v3.21.0。帶有修復鏈接的票證是#5824