Le portail francophone de la géomatique

 function init(){
            map = new OpenLayers.Map('map', {maxResolution: 360/512,  controls: []});
            var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
                "http://labs.metacarta.com/wms-c/Basic.py", {'layers':'basic'}); 
map.addLayers([wms]);
            

            wfs = new OpenLayers.Layer.WFS("Panneaux solaires", "featureserver.cgi/scribble?format=WFS", {maxfeatures: "100"}, {extractAttributes: true, displayInLayerSwitcher: true});
map.addLayers([wfs]);
            
            vectors = new OpenLayers.Layer.Vector("Vector Layer",{displayInLayerSwitcher: false});             
map.addLayers([vectors]);
            map.addControl(new OpenLayers.Control.EditingToolbar(vectors));

            map.addControl(new OpenLayers.Control.Navigation());
            map.addControl(new OpenLayers.Control.PanZoomBar());
            map.addControl(new OpenLayers.Control.MousePosition());           
            map.addControl(new OpenLayers.Control.LayerSwitcher());          
 
            var sf = new OpenLayers.Control.SelectFeature(wfs, {callbacks: {'over':feature_info}});
            map.addControl(sf);
            sf.activate();            
            geojson = new OpenLayers.Format.GeoJSON();
            
            map.zoomToMaxExtent();
            vectors.onFeatureInsert = function(feature) {
                lastFeature = feature;
                updateFeature();
                var json = geojson.write(feature.layer.features);
                json = json.replace(/,/g, ', ');
                document.getElementById('info').innerHTML = json;
            }
            wfs.preFeatureInsert = function(feature) {
                for(var i in feature.style) {
                    if (feature.attributes['fs:'+i]) {
                        feature.style[i] = feature.attributes['fs:'+i];
                    }}}
            featureid = 1; 
            vectors.events.on({
                "featuremodified": report,
                "featureadded": report
            });          
        }
        function updateFeature() {
            if (!lastFeature) { 
                alert("Sorry, no feature to modify.");
                return;
            }
            if ($("title").value) {            
                lastFeature.attributes['title'] = $("title").value;
                featureid++;
                $("title").value = "Feature " + featureid;
            }
             for(i=1; i<=3; i++) {
                if ($("key"+i).value && $("value"+i).value) {
                    lastFeature.attributes[$("key"+i).value] = $("value"+i).value;
                }}
            var json = geojson.write(lastFeature.layer.features);
            // not a good idea in general, just for this demo
            json = json.replace(/,/g, ', ');
            document.getElementById('info').innerHTML = json;
        }    
        function success() { 
            $('info').innerHTML = "Features uploaded to server."; 
            vectors.destroyFeatures();
            wfs.refresh();
        }        
        function upload() {
            url = "./featureserver.cgi/scribble";
            var json = geojson.write(vectors.features);
            new OpenLayers.Ajax.Request(url, 
                     {   method: 'post', 
                         postBody: json,
                         requestHeaders: ['Accept', 'application/json'],
                         onSuccess: success,
                         onFailure: function(xhr) {
                           $('info').innerHTML = "Failed upload (status code "+xhr.status+"). Check your URL."
                         }
                      }
                     );
        }
function report(event) {
  document.f1.rep.value=event.feature.geometry.getArea();

}

[route]
type=PostGIS
dsn=host=localhost dbname=testgis user=postgres password=xxxx
layer=route
fid=gid
geometry=the_geom
srid=22391

var rou= new OpenLayers.Layer.WFS("WFS route(postgis)", "/featureser/featureserver.cgi/route?format=WFS", 
            {maxfeatures: "300"}, {extractAttributes: true, displayInLayerSwitcher: true});