2016-03-29 178 views
2

我想用OpenLayers3顯示高分辨率圖像。 圖像(14336px×12544px)已平鋪到256px×256px的7個級別中。OpenLayers3和高分辨率圖像(XYZ源)

我正在嘗試將圖像居中並將視圖限制爲圖像(不重複)。

我已經看了程度投影但我沒做什麼,我想要的。

這裏是我的代碼:

var width = 14336; 
var height = 12544; 
var level = 6; 

var layer = new ol.layer.Tile({ 
    source: new ol.source.XYZ({ 
     url: 'http://projects.local/.../{z}/{x}/{-y}.jpg' 
    }), 
    maxZoom: level 
}); 

var view = new ol.View({ 
    center: [0, 0], 
    zoom: 2, 
    maxZoom: level 
}); 

var map = new ol.Map({ 
    target: 'viewerContainer', 
    layers: [ 
     layer, 
    ], 
    view: view 
}); 

感謝您的幫助

回答

2

我找到了解決得益於此的jsfiddle:http://jsfiddle.net/jonataswalker/6f233kLy/

var width = 14336; 
var height = 12544; 
var level = 6; 

var projection = new ol.proj.Projection({ 
    code: 'pixels', 
    units: 'pixels', 
    extent: [0, 0, height, width] 
}); 

var layer = new ol.layer.Tile({ 
    source: new ol.source.XYZ({ 
     url: 'http://projects.local/prototype/data/item1/0/0/0/{z}/{x}/{-y}.jpg', 
     projection: projection 
    }), 
    maxZoom: level 
}); 

var view = new ol.View({ 
    center: [height/2, width/2], 
    zoom: 2, 
    maxZoom: level, 
    projection: projection 
}); 

var map = new ol.Map({ 
    target: 'viewerContainer', 
    layers: [ 
     layer, 
    ], 
    view: view 
}); 

希望這將幫助別人