Wie kann ich Openlayers mit Basis-OSM- und Geoserver-WMS-Layern drucken?

Ich habe eine Karte, die ich drucken möchte, sobald der Benutzer einige Ebenen geöffnet hat. Die Schichten sind Geoserver-WMS und die Basisschicht ist OSM.

Ich weiß, dass Geoserver ein Druckmodul hat (das installiert ist und funktioniert, weil ich eine Antwort von geoserver / pdf / info.json? Var = printCapabilities bekomme

Was ich nicht verstehe, ist, wie ich damit die aktuelle Karte mit sichtbaren Ebenen drucke.

Ich habe mir das GeoExt-Beispiel (Mapfish) angesehen, aber es hat mir nicht geholfen, es zu verstehen.

Update 1: Ich habe die folgende URL per Code generiert:

http://77.235.53.170/geoserver/pdf/print.pdf?spec={%22units%22:%22degrees%22,%22srs%22:%22EPSG:4326%22,%22layout%22:%22A4%22,%22dpi%22:%22300%22,%22mapTitle%22:%22This%20is%20the%20map%20title%22,%22comment%22:%22This%20is%20the%20map%20comment%22,%22resourcesUrl%22:%20%22http://77.235.53.170/img%22,%22layers%22:[{%22baseURL%22:%22http://77.235.53.170/geoserver/Lehavim/wms%22,%22opacity%22:1,%22singleTile%22:true,%22type%22:%22WMS%22,%22layers%22:[%22%D7%A7%D7%95%20%D7%9E%D7%99%D7%9D%22],%22format%22:%22image/jpeg%22,%22styles%22:[%22%22]}],%22pages%22:[{%22center%22:[3875254.1134954,3680894.557955],%22scale%22:32000,%22rotation%22:0}]}

und ich bekomme leeres PDF (nur mit Titel) ... Was könnte falsch sein?

Der Geoserver-Druckvorgang umfasst zwei Schritte.

Zuerst müssen Sie auf der Serverseite Ihre yaml-Datei mit dem Namen config.yaml konfigurieren. Lesen Sie die ausführliche Dokumentation auf der Dokumentationsseite des MapFish-Druckmoduls .

Sobald dies erledigt ist, ist der zweite Schritt für die Client-Seite . Wenn Sie Openlayer für Ihr Front-End verwenden, benötigen Sie eine einfache Schleife mit Sichtbarkeitsprüfung, um die Liste der sichtbaren Ebenen zu erhalten, z

var layers = "";
for (var i = 0; i < map.layers.length; i++) {
    if(map.layers[i].visibility == true){
        //get a string of visible layers
        layers = layers + map.layers[i].name + ','
    }
}
//remove the trailing ','
layers = layers.slice(0, -1);

Jetzt müssen Sie dies an Ihre Druck-URL übergeben. z.B

var maptitle= "This is the map title";
var mapcomment= "This is the map comment"
var printurl = "http://host:post/geoserver/pdf/print.pdf?spec={"units":"degrees","srs":"EPSG:4326","layout":"A4","dpi":"300","maptitle":"This is the map title","comment":"This is the map comment","resourcesUrl": "http://host:port/img","layers":[{"baseURL":"http://host:port/geoserver/workspace/wms","opacity":1,"singleTile":true,"type":"WMS","layers":["' + layers + '"],"format":"image/jpeg","styles":[""]}],"pages":[{"center":[' + map.getCenter().lon + ',' + map.getCenter().lat + '],"scale":' + getMapScale(Math.ceil(map.getScale())) + ',"rotation":0}]}'

Natürlich müssen Sie relevante Änderungen an der URL vornehmen. Weisen Sie als Nächstes diese URL Ihrer Druckschaltfläche zu und rufen Sie dann pragmatisch eine Klickfunktion auf.

$("#btnprint").attr("href", printUrl);
$('#btnprint')[0].click();

Und fertig!!!

Wenn Sie ein Chrome-Nutzer sind, ist Google Cloud Print eine schnelle und einfache Möglichkeit. Es wurde jedoch zum Drucken der gesamten Webseite entwickelt. Sie können jedoch auch eine Vollbildanzeige verwenden und diese drucken.

Ein weiterer Vorteil besteht darin, dass Sie auf einem angeschlossenen Drucker überall dort drucken können, wo Sie Drucker in Ihrem Konto registriert haben, sodass der mobile Druck auf Ihrem Desktop-PC mit einem angeschlossenen Drucker oder auf jedem PC und Drucker, den Sie in Ihrem Google-Konto registriert haben, verfügbar ist. Es unterstützt Legacy-Drucker und Netzwerkdrucker, die speziell für die Verwendung mit Google Cloud Print entwickelt wurden.

Ich denke, dass Sie mit Geoserver und dem Mapfish-Plugin den richtigen Weg gehen. Damit drucke ich für meine WMS- und OSM-Basisschichten. Es gibt jedoch eine Sache zu beachten, wenn Sie diese Methode verwenden möchten. Wenn Sie möchten, dass Ihre gedruckten Karten korrekt angezeigt werden, können Sie OSM nicht direkt von dort aus verwenden, da die Projektion, in der es sich befindet, nicht richtig skaliert. Sie müssen die Daten in eine Datenbank laden und einen anderen SRS verwenden.

Nachdem ich dies gesagt habe, werde ich Ihnen einen kurzen Überblick darüber geben, wie Sie mit dem Mapfish-Plugin in Geoserver arbeiten können.

Zuerst müssen Sie das Mapfish-Plugin herunterladen und in Ihrer Geoser-Installation installieren. Als ich das zum ersten Mal tat, schien dieser Schritt nirgendwo in den Tutorials oder Demos zum Drucken dokumentiert zu sein, also dauerte es eine Weile, bis ich es herausfand. Es war auch etwas schwierig, das Plugin zu finden.

Diese Seite zeigt die Anweisungen von Geoserver zur Installation und Verwendung des Plugins. Grundsätzlich zerfällt es in:

• Gehen Sie zu dieser Seite und laden Sie die Datei geoserver-2.1-SNAPSHOT-printing-plugin.zip herunter.
• Extrahieren Sie den Inhalt des ZIP-Archivs in / WEB-INF / lib / in der GeoServer-Webanwendung
• Starten Sie Geoserver neu

Ok, jetzt, da das Plugin installiert ist, müssen Sie das Plugin konfigurieren, indem Sie die Datei config.yaml ändern, über die 'thelastray' in der obigen Antwort spricht. Die Datei sollte beim Neustart von GeoServer erstellt werden und befindet sich am folgenden Speicherort:

GEOSERVER_DATA_DIR / drucken / config.yaml

Dafür gibt es viele Optionen. Sie müssen daher die Dokumentation auf der Mapfish-Website hier durchgehen .

Der nächste Schritt besteht darin, eine Anwendung zu erstellen, die dieses Plugin zum Drucken verwendet. Ein Beispiel für eine Anwendung, die dieses Setup zum Drucken mit GeoEXT verwendet, finden Sie hier . Wenn Sie weitere Beispiele sehen möchten, schauen Sie auf dieser Seite nach.

Hoffentlich können Sie damit anfangen.

Bitte überprüfen Sie http://dev.openlayers.org/sandbox/camptocamp/canvas/openlayers/examples/exportMapCanvas.html Ich hoffe, es wird helfen.

"Karte in Papier" kann mehr als einfach sein "Bild an die Seite anpassen" ... Die Geschichte der Kartografie wurde in Papierform geschrieben, und einige kartografische Produkte verlangen heute noch Papier.

Heute ist Papier PDF - vergessen Sie EPUB oder "Print by Browser", sie warten auf Standards, CSS3 usw. sind für die Zukunft ... Und gute (Papier-) Kartografieprodukte benötigen XSLT-FO oder CSS2 . Mit (X) HTML + CSS2 können Sie gute PDF-Dateien erstellen (!) ... HTML ist nicht "für den Browser", sondern für ein Tool zur "PDF-Generierung" (das PDF-Dateien im laufenden Betrieb oder offline generiert).

Das einzige mir bekannte professionelle "Tool zum Generieren guter PDFs mit HTML + CSS2" ist PrinceXML : Ich habe mit "On-Fly-Bildern" (SVG, JPG und PNG) aus WFS- und WMS- Protokollen sowie mit OpenLayers und so weiter getestet funktioniert so gut (!).

Ich habe gerade Folgendes getan:

Heruntergeladene html2canvas.js ( https://github.com/niklasvh/html2canvas/releases )

Heruntergeladene html2canvas-proxy.php ( https://github.com/adjdred/html2canvas-proxy-php )

Installierte sie beide auf meinem Server + ref zu .js im Tag und in meinem JS:

html2canvas(document.getElementById("map"), {
    proxy: "../lib/html2canvasproxy.php",
    logging : true,
    onrendered: function (canvas) {
        var img = canvas.toDataURL("image/png");
        window.open(img);
    }
});

Gibt mir eine .png der aktuellen Karte - mit der ich alles machen kann - dauert auf meinem PC weniger als eine Sekunde.

Mini

Es ist möglich, mit den vorhandenen Tools direkt im Web zu drucken, dies erfordert jedoch einige Fähigkeiten, die Sie nicht besitzen.

Meine Lösung für Sie wäre die Verwendung von QGIS . Durch die Installation des OpenLayers-Plugins in QGIS können Sie auf die gewünschte OSM-Schicht zugreifen und die Geoserver-WMS-Schicht hinzufügen (indem Sie eine WMS-Schicht hinzufügen).

Dann können Sie mit Hilfe dieses leistungsstarken Tools mit dem gewünschten Aussehen und mehr drucken. Alles Gute, Tudor

PS. Ich weiß, dass meine Antwort wahrscheinlich nicht Ihren Erwartungen entspricht, aber sie funktioniert und bietet mehr Druckanpassungen als jede andere Weblösung.