[OpenLayers-Users] getting GeoJSON features in my search
Bart van den Eijnden
bartvde at opengeo.org
Thu Sep 27 08:00:51 PDT 2012
Maybe this well help you:
http://dev.geoext.org/geoext/trunk/geoext/examples/geocoder-geonames.html
Best regards,
Bart
--
Bart van den Eijnden
OpenGeo - http://opengeo.org
Expert service straight from the developers.
On Sep 27, 2012, at 4:49 PM, Gery . <gamejihou at hotmail.com> wrote:
>
> Hello, after several days checking on google I've found no examples to keep working on this, I'd appreciate if someone could point me to some examples, the problem is basically that the whole GeoJSON output is passed to OL no matter what I write in the search button, I don't get that part, I'd appreciate some support on this, thank you.
>
>
>
> From: gamejihou at hotmail.com
> To: openlayers-users at lists.osgeo.org
> Subject: getting GeoJSON features in my search
> Date: Tue, 25 Sep 2012 22:32:12 +0000
>
>
> After googleing for a while and reading the OL documentation, I don't understand well how the filterToParams in OpenLayers.HTTP protocol should work, what I'm trying to do is to get the GeoJSON features that matches my search using the following code:
>
> [code]
> Ext.onReady(function() {
> var map = new OpenLayers.Map();
> var osm = new OpenLayers.Layer.OSM(
> "OSM"
> );
> map.addLayer(osm);
>
> var mappanel = new GeoExt.MapPanel({
> region:"center",
> height: 400,
> width: 600,
> map: map,
> title: 'A Simple GeoExt Map'
> });
>
> var layerList = new GeoExt.tree.LayerContainer({
> text: 'All Layers',
> layerStore: mappanel.layers,
> leaf: false,
> expanded: true
> });
>
> var layerTree = new Ext.tree.TreePanel({
> title: 'Map Layers',
> maxWidth: 500,
> region: "east",
> collapsible: true,
> collapsed: true,
> root: layerList
> });
>
> var features = [];
> var vecLayer = new OpenLayers.Layer.Vector("Results");
> var select = new GeoExt.grid.FeatureSelectionModel();
>
> // define the data source
> var protocol = new OpenLayers.Protocol.HTTP({
> url: 'http://localhost/postgis_geojson.php?geotable=boreholes_point_wgs84&geomfield=geom',
> /* params: {
> outputFormat: "json"
> },
> filterToParams: function (filter, params) {
> if (filter.type === name)
> return params;
> },*/
> format: new OpenLayers.Format.GeoJSON({
> ignoreExtraDims: true,
> 'internalProjection': new OpenLayers.Projection("EPSG:900913"),
> 'externalProjection': new OpenLayers.Projection("EPSG:4326")
> })
> });
> /* protocol.read({
> callback: function(r){
> console.log("received featured: " + r.features);
> }
> });*/
>
> formPanel = new GeoExt.form.FormPanel({
> title: "Place Name Search",
> height: 150,
> region: "north",
> protocol: protocol,
> items: [{
> xtype: "textfield",
> width: 200,
> name: "station__like",
> fieldLabel: "station <br />(use * and . for wildcards)",
> allowBlank: false,
> minLength: 1
> }],
> listeners: {
> actioncomplete: function(form, action) {
> features = action.response.features;
> store.loadData(features);
> vm=map.getLayersByName("Results");
> if(vm.length===0){
> vecLayer = new OpenLayers.Layer.Vector("Results");
> map.addLayer(vecLayer);
> store.bind(vecLayer);
> select.bind(vecLayer);
> }
> }
> },
> buttons: [{text: 'search',
> handler: function(){
> formPanel.search();
> }
> }],
> keys: [{ key: [Ext.EventObject.ENTER],
> handler: function() {
> formPanel.search();
> }
> }]
> });
>
> var cols = [ {name: 'station', type: 'string'},
> {name: 'survey', type: 'string'},
> {name: 'type', type: 'string'},
> {name: 'w_depth_m', type: 'float'},
> {name: 'comments', type: 'string'},
> {name: 'latitude', type: 'float'},
> {name: 'longitude', type: 'float'}
> ];
>
> var reader = new GeoExt.data.FeatureReader({},cols);
>
> var store = new GeoExt.data.FeatureStore({
> reader: reader,
> fields: cols,
> autoLoad: false
> });
> // create grid panel configured with feature store
> gridPanel = new Ext.grid.GridPanel({
> title: "Results",
> height: 500,
> region:"center",
> store: store,
> columns: [{
> header: "Station",
> width: 100,
> sortable: true,
> dataIndex: "station"
> }, {
> header: "Survey",
> width: 40,
> sortable: true,
> dataIndex: "survey"
> }, {
> header: "Type",
> width: 40,
> sortable: true,
> dataIndex: "type"
> }, {
> header: "Water depth [m]",
> width: 40,
> sortable: true,
> dataIndex: "w_depth_m"
> }, {
> header: "Comments",
> width: 100,
> align: 'right',
> sortable: true,
> dataIndex: "comments"
> }],
> sm: select
> });
>
> gridPanel.on('rowdblclick', function(g,rowIdx,r){
> rec = store.getAt(rowIdx);
> map.setCenter(
> new OpenLayers.LonLat(
> rec.get('longitude'),
> rec.get('latitude')),
> 10);
> });
>
> searchPanel = new Ext.Panel({
> layout: "border",
> region: "west",
> collapsible: true,
> width: 400,
> items: [formPanel,gridPanel]
> });
> mainPanel = new Ext.Panel({
> height: 600,
> renderTo: "mainpanel",
> layout: "border",
> items: [searchPanel,mappanel,layerTree]
> });
>
> });
> [/code]
>
> thanks to Eric Lemoine I understand that the PHP script I'm using for the postgis request (update https://gist.github.com/3763701), should allow filtering the features I'm looking for (ie.WHERE ... LIKE ...). This script has a "parameters" option that should give this but so far it only throws an error.
>
> Sorry for probably this very simple question but I'm just starting using GeoJSON and protocol.HTTP, I'd appreciate your support, thanks,
>
> Gery
>
>
>
> __________________________________________________________________________________________
> Piensa en el medio ambiente - mantenlo en la pantalla. NO lo imprimas si NO es necesario.
> Think green - keep it on the screen. Do NOT print if it is NOT necessary.
> Denken Sie an die Umwelt - bewahren Sie es auf dem Bildschirm. Drucken Sie NICHT, wenn es NICHT notwendig ist.
> _______________________________________________
> Users mailing list
> Users at lists.osgeo.org
> http://lists.osgeo.org/mailman/listinfo/openlayers-users
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/openlayers-users/attachments/20120927/79d87634/attachment.html>
More information about the Users
mailing list