[OpenLayers-Users] map layers from extJS and php

[MartinTsenov]

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
-- 
View this message in context: http://n2.nabble.com/map-layers-from-extJS-and-php-tp3712609p3712609.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.