Le portail francophone de la géomatique

Web GIS
     

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false,
    paths: {
        GeoExt: "http://localhost:80/openlayer/libs/geoext2-2.1.0/src/GeoExt"
    }
});

Ext.require([
   
    'GeoExt.tree.OverlayLayerContainer',
    'GeoExt.tree.BaseLayerContainer',
    'GeoExt.data.LayerTreeModel',
   
]);

   Ext.onReady(function() {
       
   Ext.QuickTips.init();

        var bounds = new OpenLayers.Bounds(
                    68.1862489922762, 6.75556607519684,
                    97.4152926679075, 37.0766772569498
                );
         
    var options = {
                  maxExtent: bounds,
                   // maxResolution:  0.222,
                    projection: "EPSG:4326",
                    allOverlays: true,
                    units: 'degrees',
                    //center: new OpenLayers.LonLat(23,77),
                    zoom: 5,
                    //controls:[new OpenLayers.Control.MouseDefaults()]                                            
                };
                
                
                var map = new OpenLayers.Map('map', options);
                
                var Yaounde = new OpenLayers.Layer.WMS(
                    "Yaounde", "http://localhost:9090/geoserver/YDE/wms",
                    {
                        LAYERS: 'spatial:yde',
                        STYLES: '',
                        format: 'image/png',
                        tiled: true,
                        transparent: true
                      //  tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
                    },
                    {
                //    tileOptions: {maxGetUrlLength: 2048},
                    displayInLayerSwitcher: true,
                    isBaseLayer: false,
                    //singleTile: true,
                    transitionEffect: 'resize'
                    }
                );
                
                var National = new OpenLayers.Layer.WMS(
                    "Nationale", "http://localhost:9090/geoserver/YDE/wms",
                    {
                        LAYERS: 'spatial:national',
                        STYLES: '',
                        format: 'image/png',
                        //cql_filter: 'state_name == "BIHAR"',
                       tiled: true,
                        transparent: true
                      //  tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
                    },
                    {
                //    tileOptions: {maxGetUrlLength: 2048},
                    displayInLayerSwitcher: true,
                    isBaseLayer: false,
                    //singleTile: true,
                    transitionEffect: 'resize'
                    }
                );
                
            map.addLayers([Yaounde,National]);

 var mapPanel = Ext.create('GeoExt.panel.Map', {
           // title: 'Mappanel',
            map: map,
            region: 'center',
            stateful: true,
           // stateId: 'mappanel',
            dockedItems: [{
                xtype: 'toolbar',
                dock: 'top',
                items: [{
                    text: 'Current center of the map',
                    handler: function(){
                        var c = GeoExt.panel.Map.guess().map.getCenter();
                        Ext.Msg.alert(this.getText(), c.toString());
                    }
                }]
            }]
        });            
    
var store = Ext.create('Ext.data.TreeStore', {
            model: 'GeoExt.data.LayerTreeModel',
            root: {
                expanded: true,
                children: [
                    {
                        plugins: [{
                            ptype: 'gx_layercontainer',
                            store: mapPanel.layers
                        }],
                        expanded: true
                    }, {
                        plugins: ['gx_baselayercontainer'],
                        expanded: true,
                        text: "Base Maps"
                    }, {
                        plugins: ['gx_overlaylayercontainer'],
                        expanded: true
                    }
                ]
            }
        });
      //  var layer;
          var tree = Ext.create('GeoExt.tree.Panel', {
            border: true,
            region: "west",
            title: "Layers",
            width: 250,
            split: true,
            collapsible: true,
           // collapseMode: "mini",
            autoScroll: true,
            store: store,
            rootVisible: false,
            lines: false,
        });
        
        var north = Ext.create('Ext.panel.Panel', {
                title: "My First Web GIS page",
                 region: 'north',
                });
     
var viewport = Ext.create('Ext.Viewport', {
            layout: "fit",
            hideBorders: true,
            items: {
                layout: "border",
                deferredRender: false,
                items: [mapPanel, north, tree]
            }
        });

    
});