[Commits] r2243 - in core/trunk/geoext: examples lib/GeoExt/widgets

commits at geoext.org commits at geoext.org
Wed Jul 21 09:53:45 CEST 2010


Author: ahocevar
Date: 2010-07-21 09:53:45 +0200 (Wed, 21 Jul 2010)
New Revision: 2243

Added:
   core/trunk/geoext/examples/print-preview-osm.html
   core/trunk/geoext/examples/print-preview-osm.js
Modified:
   core/trunk/geoext/lib/GeoExt/widgets/PrintMapPanel.js
Log:
Improved resolution handling of the PrintMapPanel. As per tschaub's modification, this also changes the behavior of the PrintMapPanel to initialize with an extent that contains the source map's extent (used to preserve the source map's resolution before). r=tschaub (closes #306)


Added: core/trunk/geoext/examples/print-preview-osm.html
===================================================================
--- core/trunk/geoext/examples/print-preview-osm.html	                        (rev 0)
+++ core/trunk/geoext/examples/print-preview-osm.html	2010-07-21 07:53:45 UTC (rev 2243)
@@ -0,0 +1,34 @@
+<html>
+    <head>
+        <title>GeoExt PrintMapPanel Example</title>
+
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-2.2.1/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://extjs.cachefly.net/ext-2.2.1/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/examples/shared/examples.css" />
+        <script src="http://openlayers.org/api/2.9.1/OpenLayers.js"></script>
+        <script type="text/javascript" src="../lib/GeoExt.js"></script>
+
+        <script type="text/javascript" src="print-preview-osm.js"></script>
+        
+        <!-- The script below will load the capabilities of the print service
+             and save them into the global printCapabilities variable. Instead
+             of this, the PrintProvider can be configured with a url and take
+             care of fetching the capabilities. -->
+        <script type="text/javascript" src="http://demo.opengeo.org/geoserver/pdf/info.json?var=printCapabilities"></script>
+
+    </head>
+    <body>
+        <h1>Using a Print Preview</h1>
+        <p>This example shows the how to use GeoExt.PrintMapPanel, to create
+            a printable OSM map. It requires the
+        <a href="http://trac.mapfish.org/trac/mapfish/wiki/PrintModuleInstallation">MapFish</a>
+        or <a href="http://geoserver.org/display/GEOS/Printing+2.0+HOWTO">GeoServer</a>
+        print module. Note that attempting to print from this example will result in a server
+        exception. This is because tile.openstreetmap.org is a host which is not added to the
+        print module at demo.opengeo.org/geoserver/pdf. You need to use your own print module
+        location to make this work.</p>
+        <p>The js is not minified so it is readable. See <a href="print-preview-osm.js">print-preview-osm.js</a>.</p>
+        <div id="content"></div>
+    </body>
+</html>

Added: core/trunk/geoext/examples/print-preview-osm.js
===================================================================
--- core/trunk/geoext/examples/print-preview-osm.js	                        (rev 0)
+++ core/trunk/geoext/examples/print-preview-osm.js	2010-07-21 07:53:45 UTC (rev 2243)
@@ -0,0 +1,72 @@
+ /**
+ * 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[print-preview]
+ *  Printing with a Preview
+ *  ----------------------------------------
+ *  Using PrintMapPanel for an interactive print preview.
+ */
+
+var mapPanel, printDialog;
+
+Ext.onReady(function() {
+    // The PrintProvider that connects us to the print service
+    var printProvider = new GeoExt.data.PrintProvider({
+        method: "GET", // "POST" recommended for production use
+        capabilities: printCapabilities, // provide url instead for lazy loading
+        customParams: {
+            mapTitle: "GeoExt Printing Demo",
+            comment: "This demo shows how to use GeoExt.PrintMapPanel with OSM"
+        }
+    });
+    
+    // A MapPanel with a "Print..." button
+    mapPanel = new GeoExt.MapPanel({
+        renderTo: "content",
+        width: 500,
+        height: 350,
+        map: {
+            maxExtent: new OpenLayers.Bounds(
+                -128 * 156543.0339,
+                -128 * 156543.0339,
+                128 * 156543.0339,
+                128 * 156543.0339
+            ),
+            maxResolution: 156543.0339,
+            units: "m",
+            projection: "EPSG:900913"
+        },
+        layers: [new OpenLayers.Layer.OSM()],
+        /*layers: [new OpenLayers.Layer.WMS("Tasmania State Boundaries",
+            "http://demo.opengeo.org/geoserver/wms",
+            {layers: "topp:tasmania_state_boundaries"}, {singleTile: true})],*/
+        center: [16314984.568391, -5095295.7603428],
+        zoom: 6,
+        bbar: [{
+            text: "Print...",
+            handler: function(){
+                // A window with the PrintMapPanel, which we can use to adjust
+                // the print extent before creating the pdf.
+                printDialog = new Ext.Window({
+                    title: "Print Preview",
+                    items: [{
+                        xtype: "gx_printmappanel",
+                        sourceMap: mapPanel,
+                        printProvider: printProvider
+                    }],
+                    bbar: [{
+                        text: "Create PDF",
+                        handler: function(){ printDialog.items.get(0).print(); }
+                    }]
+                });
+                printDialog.show();
+            }
+        }]
+    });
+
+});
\ No newline at end of file

Modified: core/trunk/geoext/lib/GeoExt/widgets/PrintMapPanel.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/PrintMapPanel.js	2010-07-19 18:42:24 UTC (rev 2242)
+++ core/trunk/geoext/lib/GeoExt/widgets/PrintMapPanel.js	2010-07-21 07:53:45 UTC (rev 2243)
@@ -77,9 +77,9 @@
      *  custom set of controls, or to add a ``preaddlayer`` listener for
      *  filtering out layer types that cannot be printed.
      *  
-     *  .. note:: ``numZoomLevels`` and ``resolutions`` of the map will be set
-     *      by this PrintMapPanel, and the layers will be copied from
-     *      ``sourceMap``.
+     *  .. note:: the ``zoomToMaxExtent``, ``zoomIn`` and ``zoomOut`` methods
+     *      of the map will be overridden by this PrintMapPanel, and visible
+     *      layers will be copied from ``sourceMap``.
      */
     
     /** api: config[sourceMap]
@@ -138,6 +138,11 @@
      */
     extent: null,
     
+    /** private: property[printResolutions]
+     *  ``Array`` The resolutions available for printing
+     */
+    printResolutions: null,
+    
     /**
      * private: method[initComponent]
      * private override
@@ -154,30 +159,43 @@
             printProvider: this.printProvider
         });
         
-        var resolutions = [];
-        this.printProvider.scales.each(function(s){
-            var res = OpenLayers.Util.getResolutionFromScale(s.get("value"),
-                this.sourceMap.baseLayer.units);
-            var zoom = this.sourceMap.getZoomForResolution(res)
-            resolutions.push(this.sourceMap.baseLayer.resolutions[zoom]);
-        }, this)
+        this.updatePrintResolutions();
         
-        this.zoom = resolutions.indexOf(this.sourceMap.getResolution());
-        this.center = this.sourceMap.getCenter();
-        this.extent = null;
+        var me = this;
+        var center = this.sourceMap.getCenter();
+        this.map = Ext.apply(this.map || {}, {
+            // override zoomToMaxExtent so it brings us back to the original
+            // extent
+            zoomToMaxExtent: function() {
+                this.setCenter(center, me.getZoomForResolution(
+                    me.printResolutions[0]));
+            },
+            // override zoomIn and zoomOut to make sure that we only zoom to
+            // resolutions supported by the print module
+            zoomIn: function() {
+                this.zoomTo(me.getZoomForResolution(me.printResolutions[
+                    Math.min(
+                        me.printResolutions.indexOf(this.getResolution()) + 1, 
+                        me.printResolutions.length - 1
+                    )
+                ]));
+            },
+            zoomOut: function() {
+                this.zoomTo(me.getZoomForResolution(me.printResolutions[
+                    Math.max(
+                        me.printResolutions.indexOf(this.getResolution()) - 1, 0
+                    )
+                ]));
+            }
+        });
 
         this.layers = [];
         var layer;
-        Ext.each(this.sourceMap.layers, function(layer){
+        Ext.each(this.sourceMap.layers, function(layer) {
             var clone = layer.clone();
             layer.getVisibility() === true && this.layers.push(clone);
         }, this);
 
-        this.map = Ext.apply(this.map || {}, {
-            resolutions: resolutions,
-            numZoomLevels: resolutions.length
-        });
-
         // set an initial size with the same aspect ratio as the print page.
         // This is crucial for the first fitSize call to determine the correct
         // resolution, otherwise we may be one zoom level off.
@@ -185,14 +203,58 @@
         this.width = size.width;
         this.height = size.height;
         
+        var extent = this.sourceMap.getExtent();
+        var idealResolution = Math.max(
+            extent.getWidth()  / this.width,
+            extent.getHeight() / this.height
+        );
+        this.zoom = this.getZoomForResolution(idealResolution);
+
+        this.center = this.sourceMap.getCenter();
+        this.extent = null;
         GeoExt.PrintMapPanel.superclass.initComponent.call(this);
         
         this.fitSize();
         this.printProvider.on("layoutchange", this.fitSize, this);
+        this.printProvider.on("layoutchange", this.updatePrintResolutions, this);
         this.printPage.on("change", this.fitZoom, this);
         this.map.events.register("moveend", this, this.updatePage);
     },
     
+    /** private: method[updatePrintResolutions]
+     *  Creates an array of resolutions supported by the print module.
+     */
+    updatePrintResolutions: function() {
+        this.printResolutions = [];
+        var units = this.sourceMap.getUnits();
+        this.printProvider.scales.each(function(s){
+            var res = OpenLayers.Util.getResolutionFromScale(
+                s.get("value"), units
+            );
+            var zoom = this.sourceMap.getZoomForResolution(res)
+            this.printResolutions.push(
+                this.sourceMap.getResolutionForZoom(zoom)
+            );
+        }, this);
+    },
+    
+    /** private: method[getZoomForResolution]
+     *  :param resolution: ``Number``
+     *
+     *  Gets a zoom level that gives us a map extent fitting the print page at
+     *  the print resolution closest to the provided resolution.
+     */
+    getZoomForResolution: function(resolution) {
+        for (var i=0, len=this.printResolutions.length; i<len; i++) {            
+            if (this.printResolutions[i] < resolution) {
+                break;
+            }
+        }
+        return this.sourceMap.getZoomForResolution(
+            this.printResolutions[Math.max(0, i-1)]
+        );
+    },
+    
     /** private: method[fitSize]
      *  Fits this PrintMapPanel's width and height to the print extent. This
      *  calculation is based on the print extent for the first available scale,
@@ -203,9 +265,9 @@
     fitSize: function() {
         var extent = this.printPage.calculatePageBounds(
             this.printProvider.scales.getAt(0),
-            this.sourceMap.units);
-        var zoom = this.map.getZoomForExtent(extent);
-        var resolution = this.map.getResolutionForZoom(zoom);
+            this.sourceMap.getUnits()
+        );
+        var resolution = this.printResolutions[0];
         this.setSize(
             extent.getWidth() / resolution,
             extent.getHeight() / resolution
@@ -216,7 +278,7 @@
      *  Fits this PrintMapPanel's zoom to the print scale.
      */
     fitZoom: function() {
-        var zoom = this.map.getZoomForResolution(
+        var zoom = this.getZoomForResolution(
             OpenLayers.Util.getResolutionFromScale(
                 this.printPage.scale.get("value"),
                 this.map.baseLayer.units));
@@ -251,6 +313,7 @@
         this.map.events.unregister("moveend", this, this.updatePage);
         this.printPage.un("change", this.fitZoom, this);
         this.printProvider.un("layoutchange", this.fitSize, this);
+        this.printProvider.un("layoutchange", this.updatePrintResolutions, this);
         GeoExt.PrintMapPanel.superclass.beforeDestroy.apply(this, arguments);
     }
 });



More information about the Commits mailing list