OpenLayers学习记录（1）

1、部署自己的服务器

首先下载openlayers的源码。解压后里面有很多内容。我们只需要拷贝目录下的OpenLayer.js、根目录下的lib目录、根目录下的img目录 theme目录 到你网站的olapi目录下。
当然你也可以是使用OpenLayers中文官方站的api   http://www.openlayers.cn/olapi/OpenLayers.js

 2、创建一个 空的index.html文件
包含以下的代码：

<!DOCTYPE html>
<html>

<head>
<title>
创建一个简单的电子地图
</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<!-- 加载OpenLayers 类库 -->
<script type="text/javascript" src="http://www.openlayers.cn/olapi/OpenLayers.js">
</script>
<style>
html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
</style>
<!-- 关键代码在这里了 -->
<script type="text/javascript">
function init() {
// 使用指定的文档元素创建地图
var map = new OpenLayers.Map("rcp1_map");
// 创建一个 OpenStreeMap raster layer
// 把这个图层添加到map中
var osm = new OpenLayers.Layer.OSM();
map.addLayer(osm);
// 设定视图缩放地图程度为最大
map.zoomToMaxExtent();
}
</script>
</head>

<body onload="init()">
<div id="rcp1_map" style="width: 100%;
height: 100%;">
</div>
</body>

</html>

　

3、运行

 

posted @ 2014-01-16 14:55  marost  阅读(456)  评论(0)  编辑  收藏  举报