@Rico
2015-01-13T10:06:32.000000Z
字数 1342
阅读 3452
OpenLayers
从官网上下载OpenLayers的开发包。最新版是3.0,OL的代码已经托管到了github上,下载解压即可。
我下的是2.13版本.
OpenLayers2.X官网
OpenLayers2.X on github
OpenLayers2.x release下载 在线api等
下载完成之后目录结构式这样的
.
安装python
完成之后打开cmd,进入到build目录
在命令行中输入py build.py
这时目录下会多一个OpenLayers.js的文件
新建一个例子文件夹,放入OpenLayers中的 theme文件夹和img文件夹和刚才生成的OpenLayers.js并新建一个index.html文件。
在index.html中,添加如下代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>My OpenLayers Map</title>
<script type='text/javascript' src='OpenLayers.js'></script>
<style>
html, body { height: 100%; width: 100%; margin: 0;}
</style>
<script type='text/javascript'>
var map;
function init() {
map = new OpenLayers.Map('map'});
var wms = new OpenLayers.Layer.WMS(
'OpenLayers WMS',
'http://vmap0.tiles.osgeo.org/wms/vmap0',
{
layers: 'basic'
}
);
map.addLayer(wms);
if (!map.getCenter()) {
map.zoomToMaxExtent();
}
}
</script>
</head>
<body onload='init();'>
<div id="map" style="z-index:0;position:absolute;left:5%;top:5%;width:90%;height:90%;"></div>
</body>
</html>
如果你之前会ArcGIS for javascript API的话,那么上面的代码相信你都能够理解。
不过本篇只是做一个Hello World的例子,详细API和代码分析后续文章会慢慢介绍。
参考:
OpenLayers2官方主页
OpenLayers中文API
OpenLayers'Blog
OpenLayers'Library
OpenLayers'Documents
OpenLayers'Doc
OpenLayers'APIDoc
Examples