tim@971: OpenLayers.ProxyHost= "/cgi-bin/proxy.cgi?url="; tim@971: Ext.BLANK_IMAGE_URL = "scripts/openlayers/OpenLayers-2.9/theme/default/img/blank.gif"; tim@971: tim@971: /** tim@971: * XXX tim@971: * Change specific attributes for map, wfs-t, etc here. Do not change these tim@971: * settings inline the code! tim@971: */ tim@971: PROJECTION = "EPSG:4326"; tim@971: PROJECTIONS = [PROJECTION, 'EPSG:4326'] // Projection used in projection selector tim@971: MAX_EXTENT = new OpenLayers.Bounds(-17.44,29.41,40.04,77.66); tim@971: INITIAL_CENTER = new OpenLayers.LonLat(5, 55); tim@971: tim@971: Ext.onReady(function() { tim@971: tim@971: /* this function call initialized the layers that are defined by the user. tim@971: * The variable 'layer' and 'layers' are initialized in this function as tim@971: * well, that are used in the following code! So do not remove this function tim@971: * call. tim@971: */ tim@971: initLayers(); tim@971: tim@971: var options = { tim@971: maxExtent: MAX_EXTENT, tim@971: projection: PROJECTION, tim@971: zoom: 5, tim@971: controls: [], tim@971: units: 'm' tim@971: }; tim@971: tim@971: tim@971: /* ------------------------ Create map and add controls ---------------------*/ tim@971: // create map tim@971: map = new OpenLayers.Map(options); tim@971: map.displayProjection = new OpenLayers.Projection(PROJECTION); tim@971: tim@971: // add controls tim@971: tim@971: tim@971: var nav = new OpenLayers.Control.NavigationHistory(); tim@971: map.addControl(nav); tim@971: tim@971: panel = new OpenLayers.Control.Panel(); tim@971: controls = { tim@971: previous: nav.previous, tim@971: next : nav.next, tim@971: navigate: new OpenLayers.Control.MouseDefaults( tim@971: { tim@971: displayClass: 'olControlPan', tim@971: title:'Verschieben der Karte' tim@971: } tim@971: ), tim@971: zoombox: new OpenLayers.Control.ZoomBox( tim@971: { tim@971: displayClass: 'olControlZoomBox', tim@971: title: 'Zum Zoomen ziehen Sie eine Box auf, indem Sie klicken und ziehen' tim@971: } tim@971: ), tim@971: info : new OpenLayers.Control.WMSGetFeatureInfo({ tim@971: displayClass: "olControlFeatureInfo", tim@971: url: 'http://fluggs.wupperverband.de/wmsconnector/com.esri.wms.Esrimap/WV_WMS', tim@971: title: 'Identify features by clicking', tim@971: queryVisible: true, tim@971: eventListeners: { tim@971: getfeatureinfo: function(event) { tim@971: mapPanel.map.addPopup(new OpenLayers.Popup.FramedCloud( tim@971: "chicken", tim@971: mapPanel.map.getLonLatFromPixel(event.xy), tim@971: null, tim@971: event.text, tim@971: null, tim@971: true tim@971: )); tim@971: } tim@971: } tim@971: }) tim@971: }; tim@971: tim@971: for (var key in controls) { tim@971: panel.addControls([controls[key]]); tim@971: } tim@971: tim@971: map.addControl(panel); tim@971: map.addControl(new OpenLayers.Control.PanZoomBar({zoomWorldIcon: 'true'})); tim@971: map.addControl(new OpenLayers.Control.MouseDefaults()); tim@971: map.addControl(new OpenLayers.Control.ScaleLine()); tim@971: // Displaying the mouse postion tim@971: mousePosition = new OpenLayers.Control.MousePosition(); tim@971: map.addControl(mousePosition); tim@971: tim@971: /* --------------------------------------------------------------------------- */ tim@971: tim@971: // Scale Chooser tim@971: var scaleStore = new GeoExt.data.ScaleStore({map: map}); tim@971: var zoomSelector = new Ext.form.ComboBox({ tim@971: store: scaleStore, tim@971: emptyText: "Zoom Level", tim@971: tpl: '
1 : {[parseInt(values.scale)]}
', tim@971: editable: false, tim@971: triggerAction: 'all', // needed so that the combo box doesn't filter by its current content tim@971: mode: 'local' // keep the combo box from forcing a lot of unneeded data refreshes tim@971: }); tim@971: tim@971: zoomSelector.on('select', tim@971: function(combo, record, index) { tim@971: map.zoomTo(record.data.level); tim@971: }, tim@971: this tim@971: ); tim@971: tim@971: map.events.register('zoomend', this, function() { tim@971: var scale = scaleStore.queryBy(function(record){ tim@971: return this.map.getZoom() == record.data.level; tim@971: }); tim@971: tim@971: if (scale.length > 0) { tim@971: scale = scale.items[0]; tim@971: zoomSelector.setValue("1 : " + parseInt(scale.data.scale)); tim@971: } else { tim@971: if (!zoomSelector.rendered) return; tim@971: zoomSelector.clearValue(); tim@971: } tim@971: }); tim@971: tim@971: tim@971: // create MapPanel tim@971: mapPanel = new GeoExt.MapPanel({ tim@971: border: true, tim@971: title: "Karte mit GeoNames Suche", tim@971: region: "center", tim@971: map: map, tim@971: layers: layers, tim@971: bbar: [zoomSelector] tim@971: }); tim@971: tim@971: // map.setCenter(INITIAL_CENTER); tim@971: tim@971: /* --------------------------- Layer Tree ----------------------------------- */ tim@971: tim@971: tim@971: // LayerTree tim@971: var tree = new Ext.tree.TreePanel({ tim@971: border: true, tim@971: enableDD: true, tim@971: region: "east", tim@971: title: "LayerTree", tim@971: width: 200, tim@971: split: true, tim@971: collapsible: false, tim@971: collapseMode: "mini", tim@971: autoScroll: true, tim@971: loader: new Ext.tree.TreeLoader({ tim@971: applyLoader: false, tim@971: }), tim@971: root: { tim@971: nodeType: "async", tim@971: children: [{ tim@971: nodeType: "gx_baselayercontainer", tim@971: expanded: true tim@971: }, { tim@971: nodeType: "gx_overlaylayercontainer", tim@971: expanded: true, tim@971: loader: { tim@971: filter: function(record) { tim@971: var layer = record.get("layer"); tim@971: return layer.displayInLayerSwitcher === true && tim@971: layer.isBaseLayer === false; tim@971: } tim@971: } tim@971: }] tim@971: }, tim@971: rootVisible: false, tim@971: lines: false tim@971: }); tim@971: tim@971: /*-------------------------------- Feature grid -------------------------------*/ tim@971: tim@971: // create legend panel tim@971: legendPanel = new GeoExt.LegendPanel({ tim@971: id: 'legendpanel', tim@971: dynamic: true, tim@971: border: true, tim@971: title: 'Legende', tim@971: collapsible: false, tim@971: split: false, tim@971: defaults: { tim@971: labelCls: 'legend', tim@971: style: 'padding: 5px' tim@971: }, tim@971: bodyStyle: 'padding:5px', tim@971: width: 250, tim@971: autoScroll: true, tim@971: region: 'east' tim@971: //layerStore: mapPanel.layers tim@971: }); tim@971: tim@971: tim@971: // use separate panels tim@971: // Create GUI tim@971: tim@971: var mylegend = new Ext.Panel( tim@971: { tim@971: region: "west", tim@971: title: '', tim@971: split: true, tim@971: width: 250, tim@971: minSize: 225, tim@971: maxSize: 400, tim@971: collapsible: false, tim@971: overflow: 'auto', tim@971: margins: '0 0 0 5', tim@971: layout: 'accordion', tim@971: layoutConfig: { tim@971: animate: true, tim@971: activeOnTop: false tim@971: }, tim@971: items: [ tim@971: tree, tim@971: legendPanel tim@971: ] tim@971: } tim@971: ); tim@971: tim@971: // The main panel tim@971: new Ext.Panel({ tim@971: renderTo: "mapcontainer", tim@971: layout: "border", tim@971: width: 700, tim@971: height: 420, tim@971: items: [mapPanel, mylegend] tim@971: }); tim@971: tim@971: });