使用geoserver的wms功能发布地图（多个图层）

图层组名称：layTest（可随便起）

topp:bou2和topp:bou2p为geoserver连接mysql数据库取出的地图数据（两个图层）

提交后就可在 Mapbuiler客户端查看地图

1、使用java代码调用使用wms发布的地图（可选择图层）

页面代码：

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>调用geoserver发布好的图层(可选择图层)</title>

    <style type="text/css">
        #map {
             800px;
            height: 380px;
            border: 1px solid black;
        }
        </style>

        <script src="http://localhost:8080/geoserver/openlayers/OpenLayers.js"
            type="text/javascript">
        </script>

        <script type="text/javascript">
        var map;
        function init(){
            map = new OpenLayers.Map('map');
            var options = {numZoomLevels: 3};
            var graphic = new OpenLayers.Layer.WMS("图层1",
                "http://localhost:8080/geoserver/wms",
                {layers: "topp:bou2"}, options);
            var jpl_wms = new OpenLayers.Layer.WMS("图层2",
                "http://localhost:8080/geoserver/wms",
                {layers: "topp:bou2p"}, options);

            map.addLayers([graphic, jpl_wms]);
            map.addControl(new OpenLayers.Control.LayerSwitcher());
            map.zoomToMaxExtent();
        }
        </script>
  </head>

   <body onload="init()">
          <div id="map"></div>
   </body>
</html>

2、使用java代码调用使用wms发布的地图（不选择图层）

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>调用geoserver发布好的图层</title>
    <style type="text/css">
        #map {
             800px;
            height: 380px;
            border: 1px solid black;
        }
        </style>

        <script src="http://localhost:8080/geoserver/openlayers/OpenLayers.js"
            type="text/javascript">
        </script>

        <script type="text/javascript">
        var map;
        function init(){
            map = new OpenLayers.Map('map', options);
            var options = {
                 controls: [new OpenLayers.Control.KeyboardDefaults()]
             };
             var wms = new OpenLayers.Layer.WMS("图层",
                "http://localhost:8080/geoserver/wms",
                {layers: "layTest"},options);
             map.addLayer(wms);
             map.zoomToMaxExtent();
        }
        </script>
  </head>

  <body onload="init()">
     <div id="map"></div>
  </body>
</html>

以下是本人做的一个调用google 地图和调用 geoserver使用wms发布的地图的例子

/Files/ycsfwhh/openLayerTest.rar