[Commits] r274 - core/trunk/geoext/examples
commits at geoext.org
commits at geoext.org
Wed Mar 25 17:15:39 CET 2009
Author: tschaub
Date: 2009-03-25 17:15:39 +0100 (Wed, 25 Mar 2009)
New Revision: 274
Added:
core/trunk/geoext/examples/mappanel-div.js
core/trunk/geoext/examples/mappanel-window.js
Modified:
core/trunk/geoext/examples/mappanel-div.html
core/trunk/geoext/examples/mappanel-window.html
Log:
Making the examples more like ExtJS examples.
Modified: core/trunk/geoext/examples/mappanel-div.html
===================================================================
--- core/trunk/geoext/examples/mappanel-div.html 2009-03-25 10:02:25 UTC (rev 273)
+++ core/trunk/geoext/examples/mappanel-div.html 2009-03-25 16:15:39 UTC (rev 274)
@@ -1,59 +1,21 @@
<html>
- <head>
- <script type="text/javascript" src="../../openlayers/lib/OpenLayers.js"></script>
- <script type="text/javascript" src="../../ext/adapter/ext/ext-base.js"></script>
- <script type="text/javascript" src="../../ext/ext-all-debug.js"></script>
- <script type="text/javascript" src="../lib/GeoExt.js"></script>
-
- <link rel="stylesheet" type="text/css" href="../../ext/resources/css/ext-all.css"></link>
-
- <script type="text/javascript">
-
- // this example shows the OpenLayerish way to create a map panel. See
- // mappanel-window.html for the ExtJSish way to do the same.
-
- var mapPanel;
-
- Ext.onReady(function() {
- var map = new OpenLayers.Map();
- var layer = new OpenLayers.Layer.WMS(
- "bluemarble",
- "http://sigma.openplans.org/geoserver/wms?",
- {layers: 'bluemarble'}
- );
- map.addLayer(layer);
-
- mapPanel = new GeoExt.MapPanel({
- title: "GeoExt MapPanel",
- renderTo: "mappanel",
- height: 400,
- width: 600,
- map: map,
- center: new OpenLayers.LonLat(5, 45),
- zoom: 4
- });
- });
-
- // functions for resizing the map panel
- function mapSizeUp() {
- var size = mapPanel.getSize();
- size.width += 40;
- size.height += 40;
- mapPanel.setSize(size);
- }
- function mapSizeDown() {
- var size = mapPanel.getSize();
- size.width -= 40;
- size.height -= 40;
- mapPanel.setSize(size);
- }
-
- </script>
-
- </head>
- <body>
- <div id="mappanel"></div>
- <input type="button" onclick="mapSizeUp()" value="bigger"></input>
- <input type="button" onclick="mapSizeDown()" value="smaller"></input>
- </body>
+ <head>
+ <link rel="stylesheet" type="text/css" href="../../ext/resources/css/ext-all.css"></link>
+ <link rel="stylesheet" type="text/css" href="../../ext/examples/shared/examples.css"></link>
+ <script type="text/javascript" src="../../openlayers/lib/OpenLayers.js"></script>
+ <script type="text/javascript" src="../../ext/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="../../ext/ext-all.js"></script>
+ <script type="text/javascript" src="../lib/GeoExt.js"></script>
+ <script type="text/javascript" src="mappanel-div.js"></script>
+ </head>
+ <body>
+ <h1>GeoExt.MapPanel with an Existing OpenLayers.Map</h1>
+ <p>This example shows the how to create a MapPanel with a map that has
+ already been created. See <a href="mappanel-window.html">mappanel-window.html</a>
+ for an example that creates the MapPanel without creating the map first.<p>
+ <p>The js is not minified so it is readable. See <a href="mappanel-div.js">mappanel-div.js</a>.</p>
+ <div id="mappanel"></div>
+ <input type="button" onclick="mapSizeUp()" value="bigger"></input>
+ <input type="button" onclick="mapSizeDown()" value="smaller"></input>
+ </body>
</html>
Added: core/trunk/geoext/examples/mappanel-div.js
===================================================================
--- core/trunk/geoext/examples/mappanel-div.js (rev 0)
+++ core/trunk/geoext/examples/mappanel-div.js 2009-03-25 16:15:39 UTC (rev 274)
@@ -0,0 +1,37 @@
+
+var mapPanel;
+
+Ext.onReady(function() {
+ var map = new OpenLayers.Map();
+ var layer = new OpenLayers.Layer.WMS(
+ "bluemarble",
+ "http://sigma.openplans.org/geoserver/wms?",
+ {layers: 'bluemarble'}
+ );
+ map.addLayer(layer);
+
+ mapPanel = new GeoExt.MapPanel({
+ title: "GeoExt MapPanel",
+ renderTo: "mappanel",
+ height: 400,
+ width: 600,
+ map: map,
+ center: new OpenLayers.LonLat(5, 45),
+ zoom: 4
+ });
+});
+
+// functions for resizing the map panel
+function mapSizeUp() {
+ var size = mapPanel.getSize();
+ size.width += 40;
+ size.height += 40;
+ mapPanel.setSize(size);
+}
+function mapSizeDown() {
+ var size = mapPanel.getSize();
+ size.width -= 40;
+ size.height -= 40;
+ mapPanel.setSize(size);
+}
+
Modified: core/trunk/geoext/examples/mappanel-window.html
===================================================================
--- core/trunk/geoext/examples/mappanel-window.html 2009-03-25 10:02:25 UTC (rev 273)
+++ core/trunk/geoext/examples/mappanel-window.html 2009-03-25 16:15:39 UTC (rev 274)
@@ -1,41 +1,18 @@
<html>
- <head>
- <link rel="stylesheet" type="text/css" href="../../ext/resources/css/ext-all.css"></link>
- <script type="text/javascript" src="../../openlayers/lib/OpenLayers.js"></script>
- <script type="text/javascript" src="../../ext/adapter/ext/ext-base.js"></script>
- <script type="text/javascript" src="../../ext/ext-all-debug.js"></script>
- <script type="text/javascript" src="../lib/GeoExt.js"></script>
-
- <script type="text/javascript">
-
- // this example shows the Extish way to create a map panel. See
- // mappanel-div.html for the OpenLayerish way to do the same.
-
- var mapPanel;
-
- Ext.onReady(function() {
- new Ext.Window({
- title: "GeoExt MapPanel Window",
- height: 400,
- width: 600,
- layout: "fit",
- items: [{
- xtype: "gx_mappanel",
- id: "mappanel",
- layers: [new OpenLayers.Layer.WMS(
- "bluemarble",
- "http://sigma.openplans.org/geoserver/wms?",
- {layers: 'bluemarble'}
- )],
- extent: "-5,35,15,55"
- }]
- }).show();
-
- mapPanel = Ext.getCmp("mappanel");
- });
-
- </script>
- </head>
- <body>
- </body>
+ <head>
+ <link rel="stylesheet" type="text/css" href="../../ext/resources/css/ext-all.css"></link>
+ <link rel="stylesheet" type="text/css" href="../../ext/examples/shared/examples.css"></link>
+ <script type="text/javascript" src="../../openlayers/lib/OpenLayers.js"></script>
+ <script type="text/javascript" src="../../ext/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="../../ext/ext-all.js"></script>
+ <script type="text/javascript" src="../lib/GeoExt.js"></script>
+ <script type="text/javascript" src="mappanel-window.js"></script>
+ </head>
+ <body>
+ <h1>GeoExt.MapPanel in an Ext.Window</h1>
+ <p>This example shows the how to place a MapPanel in another Ext container
+ without creating a map first. See <a href="mappanel-div.html">mappanel-div.html</a>
+ for an example that creates the map before creating the map panel.<p>
+ <p>The js is not minified so it is readable. See <a href="mappanel-window.js">mappanel-window.js</a>.</p>
+ </body>
</html>
Added: core/trunk/geoext/examples/mappanel-window.js
===================================================================
--- core/trunk/geoext/examples/mappanel-window.js (rev 0)
+++ core/trunk/geoext/examples/mappanel-window.js 2009-03-25 16:15:39 UTC (rev 274)
@@ -0,0 +1,22 @@
+var mapPanel;
+
+Ext.onReady(function() {
+ new Ext.Window({
+ title: "GeoExt MapPanel Window",
+ height: 400,
+ width: 600,
+ layout: "fit",
+ items: [{
+ xtype: "gx_mappanel",
+ id: "mappanel",
+ layers: [new OpenLayers.Layer.WMS(
+ "bluemarble",
+ "http://sigma.openplans.org/geoserver/wms?",
+ {layers: 'bluemarble'}
+ )],
+ extent: "-5,35,15,55"
+ }]
+ }).show();
+
+ mapPanel = Ext.getCmp("mappanel");
+});
More information about the Commits
mailing list