[GeoServer]Openlayers简单调用

Openlayers Demo：

 1 <html>
 2 <head>
 3   <title>OpenLayers Example</title>
 4     <script src="OpenLayers.js"></script>
 5     </head>
 6     <body>
 7     <style type="text/css">        
 8  .Third{
 9  margin: 10px 0;
10  padding: 6px 20px;
11  font-family: 'Microsoft Yahei';
12  margin: 15px 0;
13  font-size: 16px;
14  color: fff;
15  background: #C6EFD2;
16  color: #999;
17  border-radius: 4px;
18  clear: both;}    
19  .Highlighter{
20  border: solid 1px #ccc;
21  clear: both;}
22 </style>
23       <div class="Third"><h1>欢迎来到我的世界!</h1></div>
24       <div class="Highlighter" style="width:100%; height:100%" id="map"></div>
25       <script defer="defer" type="text/javascript">
26         var map = new OpenLayers.Map('map'); 27         var bounds = new OpenLayers.Bounds( 28                     -124.73142200000001, 24.955967, 29                     -66.969849, 49.371735
30  ); 31         var wms = new OpenLayers.Layer.WMS( "WMS Layer", 32             "http://localhost:8080/geoserver/topp/wms", {LAYERS: 'topp:states'} ); 33         //var osm = new OpenLayers.Layer.OSM();
34         //map.addLayer(osm);
35  map.addLayer(wms); 36  map.zoomToExtent(bounds); 37         //map.zoomToMaxExtent();
38       </script>
39 </body>
40 </html>

View Code

Openlayers版本：OpenLayers-2.13.1

效果截图：

[GeoServer]Openlayers简单调用

阅读：

OGC标准地图服务介绍 http://blog.csdn.net/wildboy2001/article/details/7743350

秒客网

[GeoServer]Openlayers简单调用

相关文章