<head>
<script src="http://www.openlayers.org/dev/OpenLayers.js"></script>
<script type="text/javascript">
var map;
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
OpenLayers.ImgPath = "http://js.mapbox.com/theme/dark/";
function init(){
// Customize the values below to change the tileset.
// This information is available on each tileset page.
var layername = 'world-light';
var file_extension = 'png';
// Build the map
var options = {
projection: new OpenLayers.Projection("EPSG:900913"),
displayProjection: new OpenLayers.Projection("EPSG:4326"),
units: "m",
numZoomLevels: 12,
maxResolution: 156543.0339,
maxExtent: new OpenLayers.Bounds(
-20037500,
-20037500,
20037500,
20037500
)
};
map = new OpenLayers.Map('map', options);
// Layer definitions
var layer = new OpenLayers.Layer.TMS(
"MapBox Layer",
[ "http://a.tile.mapbox.com/","http://b.tile.mapbox.com/",
"http://c.tile.mapbox.com/","http://d.tile.mapbox.com/" ],
{ 'layername': layername, 'type': file_extension }
);
// Add layers to the map
map.addLayers([ layer ]);
// Set the map's initial center point
map.setCenter(new OpenLayers.LonLat(0, 0), 1);
}
</script>
</head>
<body onload="init()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
答案 0 :(得分:2)
首先,请参阅包含http://a.tile.mapbox.com/
的代码部分。将其替换为您计算机的主机名或本地名称 - 可能是http://localhost/
或http://mycomputer.com/
等。然后将layername替换为图层名称。
由于这是使用TMS图层,因此您需要创建一个名为1.0.0
的目录,它位于这两件事之间 - 如果它们位于此处,您需要将图块移动到那里一个名为mydirectory
的目录。结果就像http://localhost/1.0.0/mydirectory
。
因此,如果图块的网址为http://localhost/1.0.0/mydirectory/0/0/0.png
,则您有
var layer = new OpenLayers.Layer.TMS(
"MapBox Layer",
[ "http://localhost/" ],
{ 'layername': 'mydirectory', 'type': 'png' }
);
您可以查阅OpenLayers.org TMS以获取图层类型的完整文档。