0

I want to allow the the User to make advanced custom queries against a layer.So he can search by name or another attribute and get zoomed to the requested feature (hospital in my case) .

I´m working with GeoEXt and openlayers in client side. I build queries with php. My database is stored in potgis and as server I'm using Geoserver.

And there is what I tried.

<?php
$connection=pg_connect("host=localhost port=5432 dbname=DataBase user=postgres password=123456")
or die('Connexion impossible : ' . pg_last_error());
$result = pg_query('SELECT gid, name, ST_AsGeoJSON(geom) AS lieu FROM centres '); 

$rows = array();
while($r = pg_fetch_assoc($result)) {
    $rows[] = $r;
}
print json_encode(array_values(pg_fetch_all($result)));

?>    

    var centre = new OpenLayers.Layer.Vector("centres",{
        protocol: new OpenLayers.Protocol.HTTP({
        url: ".//test.php",
        format: new OpenLayers.Format.GeoJSON({ 
            internalProjection: epsg900913,
            externalProjection: epsg4326 })                  
        }),
        strategies: [new OpenLayers.Strategy.Fixed()]
    });

    gridStore = new Ext.data.JsonStore({
        url : './/test.php', // script d'acces a la base
        fields : ['name','geom'],
        autoLoad : true,
        storeId: 'gridStore'
    });


    //  ComboBox :
    var igtCombo = new Ext.form.ComboBox({
        id : 'igtCombo',
        fieldLabel : "research an hospital",
        triggerAction : 'all',
        emptyText : "enter name of an hospital ",
        editable : false,
        store : gridStore,
        mode : 'local',
        displayField : 'name',
        width : 240,
        height : 35,
        valueField :  'lieu'
    });

    //  Button creation :
    var submitButton = new Ext.Button({
        text : 'show in the map',
        width : 100,
        height : 35,

        // boutton click
        handler: function(){
            var x = Ext.getCmp('x').getRawValue();
            var y = Ext.getCmp('y').getRawValue();

            map.setCenter(new OpenLayers.LonLat(x,y), NiveauDeZoom);
            markers = new OpenLayers.Layer.Markers("Marker");
            map.addLayer(markers);

            //Creation du Marker
            pos = new OpenLayers.LonLat(x,y);
            map.setCenter(pos, 11);
            feature = new OpenLayers.Feature(centre, pos);
            marker = feature.createMarker();
            markers.addMarker(marker);   
        },
        renderTo: Ext.getBody()
    });          

As I'm beginner with these solutions I'm struggling to make that work.

  • if you are querying a layer with features you can do it directly using geoserver wfs service. If you are interested in an example I can post one – elasticrash May 27 '15 at 10:35
  • yes please , i would be grateful – amalGeo May 27 '15 at 10:41
1

first you need to create an openlayers filter which can have both spatial or comparison parts (this example has both)

        filterFormat = new OpenLayers.Format.Filter.v1_1_0();
        xmlFormat = new OpenLayers.Format.XML();

        var filterType = OpenLayers.Filter.Spatial.INTERSECTS;
        logicaloperator = OpenLayers.Filter.Comparison.EQUAL_TO;

        olFilter = new OpenLayers.Filter.Logical({         
            type: OpenLayers.Filter.Logical.AND,
            filters: [
                new OpenLayers.Filter.Spatial({
                    type: filterType,
                    property: 'GEOM',
                    value: geometry,
                    projection: map.getProjection()
                }),
                new OpenLayers.Filter.Comparison({
                    type: logicaloperator,
                    property:Ext.getCmp('smuf_id').valueModels[0].data.field+"_ID",
                    value: Ext.getCmp('lut_id').getValue()
                })
            ]
        });

            var ogcFilter = filterFormat.write(olFilter),
            ogcFilterString =xmlFormat.write(ogcFilter);

then you do an ajax request to the geoserver wfs service

            Ext.Ajax.request({
            url: OpenLayers.ProxyHost+geoserverWfsDefaults.wfsUrl,
            method: 'POST',
            params: {
                filter: filter,
                typeName: 'ELPHO:SMU_MV_DESC', //layername
                geomnameplacehoder: 'GEOM',
                version:geoserverWfsDefaults.wfsVersion,
                request:'GetFeature',
                outputFormat:'json'
            },
            callback: function(){
            },
            success: function(response, options){
                var text = response.responseText;
                if (text !== "") {
                    var geojsonformat = new OpenLayers.Format.GeoJSON(),
                        features = geojsonformat.read(text),
                        featureCount = features.length,
                        verticeCount = 0;

                    if(featureCount == 0)
                    {
                        Ext.Msg.alert('info', 'no results');
                    }

            },
            failure: function(response, options){
            }
        });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.