[OpenLayers-Users] map layers from extJS and php

[Andreas Hocevar]

Hi,

my guess would be that you are not using Spherical Mercator properly,
which is required if you use google layers. See
http://docs.openlayers.org/library/spherical_mercator.html

On a side note: are you aware of http://geoext.org/ ?

Regards,
Andreas.

MartinTsenov wrote:
> Hi,
>
> I have problems to define map layers with php and extJS (Ext.data.Store)
>
> I am trying to define several map layers. I defined google and openStreet
> map layers and now wanted dynamically to generate few more via
> Ext.data.Store, Ext.data.JsonReader and php (for now php script just return
> some data, will be connect to postgre in the future). So the debugging with
> firebug shows that the data was received on the client side and seems to be
> well-formated
> {"total":"int","layers":[{"name":"name","url":"urlData","layers":"layersMapFile"},]},
> .I can see the objects with data via “firebug->DOM->map->layers” but the
> dynamic layers are not displayed, only the google and openStreet are there.
> What could be the problem – am I missing something?
>
> Here is my code
>
> //Dynamic create WMS layer
> var createWmsLayer = function(name, url, params, options) {
>     map.addLayer(new OpenLayers.Layer.WMS(name, url, params, options));
> };
>
> store = new Ext.data.Store({
>     autoLoad: true,
>     id: 'store',
>     proxy: new Ext.data.HttpProxy({
>         url: 'layer_management.php', 
>         method: 'POST'
>     }),
>     baseParams:{task: "LISTING"}, // this parameter is passed for any HTTP
> request
>     reader: new Ext.data.JsonReader({
>     idProperty: 'id',
>     root: 'layers',
>     totalProperty: 'total',
>     fields:[{name: 'name', mapping: 'name' },
>         {name: 'url', mapping: 'url'},
>         {name: 'layers', mapping: 'layers'}]                           
>     }),
>       listeners: {
>         'load': function () {
>           store.data.each(function(item, index, totalItems ) {
>                createWmsLayer(
>               item.data['name'],
>               item.data['url'], 
>             {
>                     layers: item.data['layers'], 
>                        format: 'image/png', 
>                        transparent: true,
>                        singleTile: true
>                    },
>                    {isBaseLayer: false, visibility: false}
>                ) 
>            console.info(item.data['name'] + ' : ' + item.data['url'] + ' : '
> + item.data['layers']);
>         });
>         }
>       }
> });
>
>
> I use Ext.Viewport to show it:
>
> viewport = new Ext.Viewport({
>     layout: 'border',
>     items: [
>            new Ext.BoxComponent({
>            ......
>            height: 60
>            }),{  
>               region: 'west',
>               title: 'LayerTree',
>               ........
>               collapsible: true,
>               items: [{ 
>                    xtype: 'layertree',
>                    map: map, 
>                    border: false 
>               }]
>            },{
>            region: 'center',
>            ..........
>            margins: '5 5 0 0',
>            items: [{
>                   xtype: 'mapcomponent',
>                   map: map,
>                   tbar: toolbar,
>                   border: false
>                }]
>            },{
>            region: 'south',
>            ....
>            }
>      ]
> });
>
>
> Thanks in advanced
>
> Martin
>   


-- 
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.