Я использую openlayers для создания карты тела. Он показывает mri-scan человека en, есть много маркеров.openlayers 3: не увеличивайте изображение за пределами изображения
Полностью уменьшенный, есть много пробелов (или в моем случае черное пространство, когда фон черный) Я настроил openlayers с параметром степени, так что пользователи не могут панорамировать дальше, чем изображение большое , Однако, когда пользователь нависает над пробелами вокруг него и прокручивает для увеличения, изображение масштабируется в соответствии с положением курсора, поэтому тело выходит из поля зрения. После того, как пользователь снова начнет панорамирование, он начинает играть и возвращается к краю изображения.
Есть ли способ отключить масштабирование в/из, когда курсор выходит за пределы? Или, если это невозможно, как я могу вызвать перемещение/панорамирование, чтобы оно автоматически переходило на край изображения?
EDIT 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();
});
Создайте пример плункера. Это поможет нам решить вашу проблему? –
Я добавил код и пример jsfiddle. –