MapServer使用笔记(三)

MapServer使用笔记(三)
发布 WFS 矢量地图

OGC WFS协议定义了地图客户端查询和传送矢量数据的方法,在查询、分析、动态绘图等实际应用中非常有用。MapServer支持OGC WFS 1.0.0和1.1.0规范。

重新定义一个Mapfile文件,命名为ext2.map,内容如下:
MAP

  NAME "vector"
    SHAPEPATH "I://cn_data"
    
    FONTSET fonts.txt
    IMAGECOLOR 255 255 255
    IMAGETYPE agg

    SIZE 800 600
    STATUS ON
    UNITS DD
    EXTENT 115.275 39.2204 117.475 40.9462
   
    OUTPUTFORMAT
        NAME agg
        DRIVER AGG/PNG
        IMAGEMODE RGB
        FORMATOPTION "INTERLACE=false"
        MIMETYPE "image/png"
    END

    PROJECTION
        "init=epsg:4326"
    END

    WEB
        METADATA
            "wms_title"                       "road wms"
            "wfs_title"                       "road wfs"
            "wms_onlineresource"              "http://192.98.151.23/cgi-bin/mapserv.exe?"  #mapserver服务器的url
            "wms_srs"                         "EPSG:4326"   #地图坐标系        
        END
    END

    LAYER
        NAME "road"
        METADATA
            "wms_title"                       "road"
            "wfs_title"                       "road"
            "wms_srs"                         "EPSG:4326"  #图层坐标系
            "gml_include_items"             "all"
            "gml_featureid"                 "id" #必须指定id
        END
        STATUS ON
        DATA "roa_4m.shp"
        TYPE line
        DUMP TRUE
        CLASS
            STYLE
                COLOR "#00FF00"
            END
        END
    END

END

该文件中有两组METADATA标签,是WFS(WMS) Server所需要的,分别是MAP的METADATA标签和LAYER的METADATA标签。
前者是针对整个地图的全局定义,后者是每个图层的元数据定义。

保存Mapfile文件,打开浏览器进行测试
http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&SERVICE=WFS&VERSION=1.0.0&REQUEST=GetCapabilities
正常情况下,可以看到以下返回信息
<WFS_Capabilities version="1.0.0" updateSequence="0" xsi:schemaLocation="http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.0.0/WFS-capabilities.xsd">
<!--
 MapServer version 5.2.1 OUTPUT=GIF OUTPUT=PNG OUTPUT=JPEG OUTPUT=WBMP OUTPUT=PDF OUTPUT=SWF OUTPUT=SVG SUPPORTS=PROJ SUPPORTS=AGG SUPPORTS=FREETYPE SUPPORTS=ICONV SUPPORTS=FRIBIDI SUPPORTS=WMS_SERVER SUPPORTS=WMS_CLIENT SUPPORTS=WFS_SERVER SUPPORTS=WFS_CLIENT SUPPORTS=WCS_SERVER SUPPORTS=SOS_SERVER SUPPORTS=FASTCGI SUPPORTS=THREADS SUPPORTS=GEOS SUPPORTS=RGBA_PNG INPUT=JPEG INPUT=POSTGIS INPUT=ORACLESPATIAL INPUT=OGR INPUT=GDAL INPUT=SHAPEFILE
-->
<Service>
<Name>MapServer WFS</Name>
<Title>road wfs</Title>
<OnlineResource>
http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&
</OnlineResource>
</Service>
<Capability>
<Request>
<GetCapabilities>
<DCPType>
<HTTP>
<Get onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
<DCPType>
<HTTP>
<Post onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
</GetCapabilities>
<DescribeFeatureType>
<SchemaDescriptionLanguage>
<XMLSCHEMA/>
</SchemaDescriptionLanguage>
<DCPType>
<HTTP>
<Get onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
<DCPType>
<HTTP>
<Post onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
</DescribeFeatureType>
<GetFeature>
<ResultFormat>
<GML2/>
</ResultFormat>
<DCPType>
<HTTP>
<Get onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
<DCPType>
<HTTP>
<Post onlineResource="http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&"/>
</HTTP>
</DCPType>
</GetFeature>
</Request>
</Capability>
<FeatureTypeList>
<Operations>
<Query/>
</Operations>
<FeatureType>
<Name>road</Name>
<Title>road</Title>
<SRS>EPSG:4326</SRS>
<LatLongBoundingBox minx="80.3869" miny="18.2823" maxx="132.515" maxy="49.6272"/>
</FeatureType>
</FeatureTypeList>
<ogc:Filter_Capabilities>
<ogc:Spatial_Capabilities>
<ogc:Spatial_Operators>
<ogc:Equals/>
<ogc:Disjoint/>
<ogc:Touches/>
<ogc:Within/>
<ogc:Overlaps/>
<ogc:Crosses/>
<ogc:Intersect/>
<ogc:Contains/>
<ogc:DWithin/>
<ogc:BBOX/>
</ogc:Spatial_Operators>
</ogc:Spatial_Capabilities>
<ogc:Scalar_Capabilities>
<ogc:Logical_Operators/>
<ogc:Comparison_Operators>
<ogc:Simple_Comparisons/>
<ogc:Like/>
<ogc:Between/>
</ogc:Comparison_Operators>
</ogc:Scalar_Capabilities>
</ogc:Filter_Capabilities>
</WFS_Capabilities>

在OpenLayers中加载WFS图层

OpenLayers是一个功能强大的Web地图客户端引擎。

接下来,我们利用OpenLayers的OpenLayers.Protocol.WFS类,显示刚才发布的WFS图层,代码如下

       var protocol = OpenLayers.Protocol.WFS({
                    url: "http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&", //mapserver地图服务器的url,加上mapfi了文件的路径
                    featureType: "road", //layer的名称
                    srsName: "EPSG:4326", //layer的坐标系
                    geometryName: "msGeometry", //geometry字段的名称
                    featurePrefix: "ms"
                });

以下是全部javascript代码:
        window.onload = function() {
                var map = new OpenLayers.Map('mapdiv', {
                    projection: "EPSG:4326",
                    units: "degree"
                });
                
                var roads = new OpenLayers.Layer.WMS("road", "http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&", {
                    layers: 'road',
                    transparent: 'true',
                    format: 'image/png'
                }, {
                    isBaseLayer: false,
                    visibility: true,
                    buffer: 0
                });
                
                
                var empty = new OpenLayers.Layer("empty", {
                    isBaseLayer: true
                });
                
                var select = new OpenLayers.Layer.Vector("Selection", {
                    styleMap: new OpenLayers.Style(OpenLayers.Feature.Vector.style["select"]),
                    displayInLayerSwitcher: false
                });
                
                var hover = new OpenLayers.Layer.Vector("Hover", {
                    displayInLayerSwitcher: false
                });
                
                map.addLayers([roads, hover, select, empty]);
                
                var protocol = OpenLayers.Protocol.WFS({
                    url: "http://192.98.151.23/cgi-bin/mapserv.exe?map=I:/cn_data/ext2.map&",
                    featureType: "road",
                    srsName: "EPSG:4326",
                    geometryName: "msGeometry",
                    featurePrefix: "ms"
                });
                
                var control = new OpenLayers.Control.GetFeature({
                    protocol: protocol,
                    box: true,
                    hover: true,
                    multipleKey: "shiftKey",
                    toggleKey: "ctrlKey"
                });
                
                control.events.register("featureselected", this, function(e){
                    select.addFeatures([e.feature]);
                });
                control.events.register("featureunselected", this, function(e){
                    select.removeFeatures([e.feature]);
                });
                control.events.register("hoverfeature", this, function(e){
                    hover.addFeatures([e.feature]);
                });
                
                control.events.register("outfeature", this, function(e){
                    hover.removeFeatures([e.feature]);
                });
                
                map.addControl(control);
                control.activate();
                
                map.addControl(new OpenLayers.Control.LayerSwitcher());
                map.addControl(new OpenLayers.Control.MousePosition());
                
                if (!map.getCenter()) {
                    map.zoomToMaxExtent();
                }

            }

在浏览器中运行html页面,国道数据将以矢量方式传送到客户端,由openlayers动态绘制,鼠标移动到道路上或者选中道路,道路将实时改变颜色,在Web上实现与传统桌面GIS应用类似的体验效果。

你可能感兴趣的:(MapServer使用笔记(三))