为什么 OpenLayers-3 会加载太多地图?
Why does OpenLayers-3 load too much map?
我正在尝试从网页中的地理服务器加载地图,当它加载时它几乎翻倍了。第一张地图是来自地理服务器管理页面的预览,第二张是它在网页上拉出时的加载方式。
Openlayers 使用图块系统,地图将在 Web 浏览器中不断自我重复,以确保持续覆盖和无缝视图填充 screen/div。聚焦特定区域的最简单方法是使用缩放级别。
var map = new OpenLayers.Map("mapdiv");
map.setCenter(new OpenLayers.LonLat(yourLong, yourLat), zoomLevel);
上面的代码将以给定缩放级别作为 int 值的特定区域为中心。这里还有其他设置边界和缩放的方法:
http://dev.openlayers.org/docs/files/OpenLayers/BaseTypes/Bounds-js.html
我最终通过在层中添加一些属性来弄清楚这是我的代码:
mapInit: function() {
var _this = this;
this.map = new ol.Map({
target: 'mapdiv', //element to render in
interactions: ol.interaction.defaults({
shiftDragZoom: false,
altShiftDragRotate: false,
dragPan: false
}),
controls: ol.control.defaults({
attributionOptions: ({
collapsible: true
})
}).extend([ new ol.control.ScaleLine() ]),
renderer: 'canvas',
layers: [
new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'http://***.**.**.***:8080/geoserver/Global/wms',
params: {'LAYERS': 'Global Map', 'TILED': true},
noWrap: true, //<----added this
wrapX: false //<----added this
}),
//constrain the extent of the servable tiles to only 1 world's coordinates.
extent: [-20037508.34, -20037508.34, 20037508.34, 20037508.34] //<----added this
})
],
我正在尝试从网页中的地理服务器加载地图,当它加载时它几乎翻倍了。第一张地图是来自地理服务器管理页面的预览,第二张是它在网页上拉出时的加载方式。
Openlayers 使用图块系统,地图将在 Web 浏览器中不断自我重复,以确保持续覆盖和无缝视图填充 screen/div。聚焦特定区域的最简单方法是使用缩放级别。
var map = new OpenLayers.Map("mapdiv");
map.setCenter(new OpenLayers.LonLat(yourLong, yourLat), zoomLevel);
上面的代码将以给定缩放级别作为 int 值的特定区域为中心。这里还有其他设置边界和缩放的方法:
http://dev.openlayers.org/docs/files/OpenLayers/BaseTypes/Bounds-js.html
我最终通过在层中添加一些属性来弄清楚这是我的代码:
mapInit: function() {
var _this = this;
this.map = new ol.Map({
target: 'mapdiv', //element to render in
interactions: ol.interaction.defaults({
shiftDragZoom: false,
altShiftDragRotate: false,
dragPan: false
}),
controls: ol.control.defaults({
attributionOptions: ({
collapsible: true
})
}).extend([ new ol.control.ScaleLine() ]),
renderer: 'canvas',
layers: [
new ol.layer.Tile({
source: new ol.source.TileWMS({
url: 'http://***.**.**.***:8080/geoserver/Global/wms',
params: {'LAYERS': 'Global Map', 'TILED': true},
noWrap: true, //<----added this
wrapX: false //<----added this
}),
//constrain the extent of the servable tiles to only 1 world's coordinates.
extent: [-20037508.34, -20037508.34, 20037508.34, 20037508.34] //<----added this
})
],