¿Cómo puedo imprimir Openlayers con capas base de OSM y Geoserver WMS?

Question

Tengo un mapa que quiero imprimir una vez que el usuario abra algunas capas. Las capas son geoserver wms y la capa base es de OSM.

Sé geoserver ha módulo de impresión (que está instalado y funcionando porque me dan respuesta de geoserver/pdf/info.json?var=printCapabilities

Lo que no entiendo es cómo yo lo uso para imprimir el mapa actual con las capas visibles.

He mirado en GeoExt ejemplo (mapfish) pero no, no me ayude a entender.

Actualización 1 : He generado la dirección URL siguiente código :

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}]}

y me estoy poniendo vacío PDF (sólo el título)... Lo que podría estar equivocado ?

Answer 1

Geoserver proceso de impresión consiste en dos pasos.

Primero en el lado del servidor, tiene que configurar el archivo yaml, llamado config.yaml. Ir a través de la documentación detallada en MapFish módulo de impresión de la página de la documentación.

Una vez hecho esto, el segundo paso es para el lado del cliente. Teniendo en cuenta que están utilizando openlayers para su front-end, con el fin de obtener la lista de capas visibles, se necesita un circuito simple con una visibilidad de verificación, por ejemplo,

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);

Ahora usted tiene que pasar esto a su impresión url. e.g

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}]}'

Por supuesto, usted tendrá que hacer los cambios pertinentes en la dirección URL. Asignar este URL en su botón imprimir y, a continuación, llamar a un clic de la función pragmática.

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

Y listo!!!

Answer 2

Si usted es un Usuario de Chrome, de una manera simple y rápida que es de Google Cloud Print, pero que está diseñado para la impresión de la página web completa, pero se puede usar una completa visualización de la pantalla y de impresión.

Otra ventaja es que se puede imprimir en una impresora conectada en cualquier lugar que se han registrado impresoras en su cuenta, por lo que la impresión móvil está disponible para su PC de escritorio con una impresora conectada, o cualquier Pc y la Impresora que se han registrado en contra de su cuenta de Google. Lo hace compatible con el Legado de las Impresoras y las impresoras de red diseñado específicamente para trabajar con Google Cloud Print.

Answer 3

Creo que vas por el camino correcto con geoserver y la mapfish plugin. Es lo que yo uso para hacer la impresión para mi WMS y la OSM baselayers. Hay una cosa a tener en cuenta si se va a utilizar este método, aunque. Si quieres que tus mapas impresos para ser scalled correctamente, usted no será capaz de usar OSM directamente a partir de ahí que la proyección es en no se ajusta correctamente. Usted tendrá que cargar los datos en una base de datos y el uso de diferentes SRS.

Habiendo dicho esto te voy a dar un resumen rápido sobre cómo obtener la impresión de trabajar con el mapfish plugin en geoserver.

En primer lugar usted necesita para descargar el mapfish plugin e instalarlo en su geoser de la instalación. La primera vez que hice esto que paso no parece ser documentado en cualquier lugar en los tutoriales o demostraciones para la impresión, así que fue un tiempo antes de que me lo imaginé. También fue un poco difícil encontrar el plugin.

Esta página se muestran las instrucciones de Geoserver sobre cómo instalar el plugin y el uso. Básicamente se descompone en:

• Vaya a esta página y descargar el geoserver-2.1-SNAPSHOT-printing-plugin.zip archivo.
• Extraer el contenido del archivo ZIP en /WEB-INF/lib/ en el GeoServer webapp
• Reinicie Geoserver

Ok, ahora que el plugin se ha instalado la necesitará conifure el plugin que se realiza mediante la modificación de la configuración.archivo yaml que 'thelastray' habla en su respuesta anterior. El archivo debe ser creado cuando GeoServer se reinicia y se encuentra en la siguiente ubicación:

GEOSERVER_DATA_DIR/imprimir/config.yaml

Hay un montón de opciones para esto, por lo que tendrá que ir a través de la documentación en el Mapfish sitio web aquí.

El siguiente paso es crear una aplicación que utiliza este plugin para hacer la impresión. Un ejemplo de una aplicación que utiliza esta configuración para imprimir mediante GeoEXT se puede encontrar aquí. Si desea ver algunos ejemplos más de la mirada en esta página.

Esperemos que le ayudará a empezar.

Answer 4

Me acabo de hacer este:

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

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

Instalado en mi servidor + ref .js en la etiqueta y en mi JS:

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

Me da una .png del mapa actual - que puedo hacer lo que con - lleva menos de un segundo en mi pc.

Mini

Answer 5

Por favor revisa http://dev.openlayers.org/sandbox/camptocamp/canvas/openlayers/examples/exportMapCanvas.html que espero que ayude.