/** * Copyright (c) 2008-2010 The Open Source Geospatial Foundation * * Published under the BSD license. * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text * of the license. */ /** api: example[zoom-chooser] * Scale Chooser * ------------- * Use a ComboBox to display available map scales. */ var mapPanel; Ext.onReady(function() { var map = new OpenLayers.Map(); var layer = new OpenLayers.Layer.WMS( "Global Imagery", "http://maps.opengeo.org/geowebcache/service/wms", {layers: "bluemarble"} ); map.addLayer(layer); var scaleStore = new GeoExt.data.ScaleStore({map: map}); var zoomSelector = new Ext.form.ComboBox({ store: scaleStore, emptyText: "Zoom Level", tpl: '
1 : {[parseInt(values.scale)]}
', editable: false, triggerAction: 'all', // needed so that the combo box doesn't filter by its current content mode: 'local' // keep the combo box from forcing a lot of unneeded data refreshes }); zoomSelector.on('select', function(combo, record, index) { map.zoomTo(record.data.level); }, this ); map.events.register('zoomend', this, function() { var scale = scaleStore.queryBy(function(record){ return this.map.getZoom() == record.data.level; }); if (scale.length > 0) { scale = scale.items[0]; zoomSelector.setValue("1 : " + parseInt(scale.data.scale)); } else { if (!zoomSelector.rendered) return; zoomSelector.clearValue(); } }); mapPanel = new GeoExt.MapPanel({ title: "GeoExt MapPanel", renderTo: "mappanel", height: 400, width: 600, map: map, center: new OpenLayers.LonLat(5, 45), zoom: 4, bbar: [zoomSelector] }); });