Javascript Openlayers限制了对整个世界的缩放
我将OpenStreetMap与openlayers一起使用,并将900913转换为27700。我正在使用maxextent并尝试将地图居中,但我想要实现的是,地图不应缩小到整个世界。我该怎么做?我的代码如下Javascript Openlayers限制了对整个世界的缩放,javascript,openlayers,Javascript,Openlayers,我将OpenStreetMap与openlayers一起使用,并将900913转换为27700。我正在使用maxextent并尝试将地图居中,但我想要实现的是,地图不应缩小到整个世界。我该怎么做?我的代码如下 var projDisplay = new OpenLayers.Projection("EPSG:27700"); var projmerc = new OpenLayers.Projection("EPSG:900913"); map = new OpenLayers.Map("ma
var projDisplay = new OpenLayers.Projection("EPSG:27700");
var projmerc = new OpenLayers.Projection("EPSG:900913");
map = new OpenLayers.Map("map", {scales[200000,150000,100000,50000,20000,10000,5000,2500],
maxExtent: new openLayers.Bounds("350000,380000, 380000,400000"),
minzoomlevel: "10",
numZoomLevels: "19",
units: 'm',
projection: projmerc,
displayProjection: projDisplay} );
var mapnik_layer = new OpenLayers.Layer.OSM("OpenStreetMap");
map.addLayers([mapnik_layer]);
var lonlat = new OpenLayers.LonLat("362431.71","389042.78");
lonlat.transform(projDisplay, projmerc);
map.setCenter(lonlat, 13);
我承认我从未使用过Mapnik,所以我不知道它能做什么,但是假设您发布的代码中的打字错误——例如,应该是“scales:[”而不是“scales[”——不在您的工作代码中,您不能设置任何其他依赖于比例的选项(例如,numZoomLevels、minZoomlevel)在地图选项中,因为它们将替代比例设置 但更重要的是,图层设置将覆盖地图设置,在这种情况下,我不认为OpenLayers.layer.OSM作为第三方提供商将允许您设置自己的比例。如果使用相对较小的OSM区域,为什么不下载maxExtents的边界框并自行提供地图数据以获得更大的灵活性 以下是一些有用的链接: 添加: 这是一个可以玩的小提琴(非Mapnik),它可以正确地缩放到你的最大范围,而不是整个世界,如要求: Javascript:
var projMercator = new OpenLayers.Projection("GOOGLE");
var projBritNatGrid = new OpenLayers.Projection("EPSG:27700");
var navigation_control = new OpenLayers.Control.Navigation({});
var controls_array = [
navigation_control,
new OpenLayers.Control.PanZoomBar({}),
new OpenLayers.Control.LayerSwitcher({}),
new OpenLayers.Control.MousePosition({})
];
var layerOSM = new OpenLayers.Layer.OSM("OpenStreetMap");
var scales = [200000,150000,100000,50000,20000,10000,5000,2500];
var map = new OpenLayers.Map({
div: "map",
units: 'm',
scales: scales,
Projection: projMercator,
DisplayProj: projBritNatGrid,
controls: controls_array
});
map.addLayer(layerOSM);
var myMaxExtent = new OpenLayers.Bounds("350000,380000, 380000,400000");
myMaxExtent.transform(projBritNatGrid, projMercator);
var lonlat = new OpenLayers.LonLat("362431.71","389042.78");
lonlat.transform(projBritNatGrid, projMercator);
map.setCenter(lonlat, 13);
map.events.register("zoomend", map, function(){
document.getElementById("getCenter").innerHTML=map.getCenter();
document.getElementById("getScale").innerHTML=map.getScale();
});
HTML:
<script type="text/javascript" src="http://openlayers.org/dev/OpenLayers.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/proj4js/1.1.0/proj4js-compressed.min.js"></script>
<script type="text/javascript" src="http://spatialreference.org/ref/epsg/27700/proj4js/"></script>
<div id="map"></div>
<table class="gridtable">
<tr><th>object</th><th>value</th></tr>
<tr><td>Center</td><td><div id="getCenter"></div></td></tr>
<tr><td>Scale</td><td><div id="getScale"></div></td></tr>
</table>
#map
{
width: 600px;
height: 600px;
border: 1px solid black;
}
table.gridtable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border: 1px solid black;
}
table.gridtable th {
border: 1px solid black;
padding: 8px;
background-color: khaki;
}
table.gridtable td {
padding: 8px;
border: 1px solid black;
background-color: #ffffff;
}