openlayer学习网站

[/color]http://dev.openlayers.org/releases/OpenLayers-2.13.1/doc/apidocs/files/OpenLayers-js.html

openlayer构建地图：
1、页面引用div:
<div id="map" class="smallmap"></div>

2、css样式表：主要是smallmap样式的引用 512*256
#map {
        background : #7391ad;
        width      : 100%;
}
#map {
        border : 0;
        height : 250px;
}
[color=red].smallmap {
    width: 512px;
    height: 256px;
    border: 1px solid #ccc;
}

3.页面脚本：引用OpenLayer库（必须）及zoom.js实现移动功能
<script src="../lib/OpenLayers.js"></script>
<script src="zoom.js"></script>

4.zoom.js 部分代码:利用div创建
var map = new OpenLayers.Map({
    div: "map", //div_id="map"
    layers: [new OpenLayers.Layer.OSM()],//图层array
    controls: [ //控件array
        new OpenLayers.Control.Navigation({
            dragPanOptions: {
                     enableKinetic: true
                        //enable “kineticdragging”.
            }
        }),
        new OpenLayers.Control.Attribution(),//图层显示
        new OpenLayers.Control.Zoom()//图层默认移入移出---控件的添加
    ],
    center: [0, 0], //原点
    zoom: 1 //初始化级数
});

猜你喜欢