I followed this documentation to use the printing service in geoserver.
I want to print the map layer in pdf format.
Below is my index.html for displaying the map and a button to print the map,
index.html:
<div id="map"></div>
<a id="export-pdf"><span id="button-label" class="btn btn-info"> Export(pdf)</span></a>
<script>
var URL = 'http://localhost:9090/geoserver/BernHardt_Practical/wms';
var centerpos = [84.2, 28.2];
var newpos = ol.proj.transform(centerpos, 'EPSG:4326', 'EPSG:900913');
var baseLayer = new ol.layer.Tile({
projection : projection1,
source: new ol.source.OSM(),
isBaseLayer: true
});
var projection1 = new ol.proj.Projection({
code: 'EPSG:4326',
units: 'degrees',
axisOrientation: 'neu'
});
var Nepal = new ol.layer.Tile({
visible: true,
label:'Nepal',
source: new ol.source.TileWMS({
projection : projection1,
url: URL,
params: {
LAYERS: 'BernHardt_Practical:Nepal'
},
serverType: 'geoserver'
}),
name: 'Nepal Boundary',
isBaseLayer: false
});
var map = new ol.Map({
layers: [baseLayer, Nepal],
target: 'map',
view: new ol.View({
center : newpos,
zoom: 7
})
});
</script>
I have linked mapprint.js to apply the MapFish Print plugin.
mapprint.js
var specs={
"layout":"A4 portrait",
"srs":"EPSG:4326",
"units":"degrees",
"dpi":150,
"mapTitle":"test",
"layers":[
{
"baseURL":"http://localhost:9090/geoserver/BernHardt_Practical/wms",
"opacity":1.0,
"singleTile":false,
"type":"WMS",
"layers":["Nepal"],
"format":"image/png"
}
],
"pages":[
{
"center":[84.2,28.2],
"scale":2000000
}
]
};
$("#export-pdf").click(function(){
var json = JSON.stringify(specs);
alert(json);
$.ajax(
{
url:'http://localhost:9090/geoserver/pdf/print.pdf',
type: 'POST',
data:
{
spec: json
},
success: function()
{
alert("Success");
},
error: function()
{
alert("Failure");
}
});
});
The map is displayed properly and ajax call is working fine but the problem is that it is not printing the pdf. I don't know where my mistake is.
According to the documentation, print.pdf command should have displayed the popup window for downloading the pdf file but nothing is happening.
My conf.yaml file is like this,
conf.yaml
# allowed DPIs
dpis: [75, 150, 300]
# the allowed scales
scales:
- 25000
- 50000
- 100000
- 200000
hosts:
- !localMatch
dummy: true
formats:
- pdf
- png
layouts:
A4 portrait:
mainPage:
pageSize: A4
rotation: true
items:
- !text
text: '${mapTitle}'
fontSize: 30
spacingAfter: 30
- !map
spacingAfter: 30
width: 400
height: 400
- !columns
absoluteX: 410
absoluteY: 310
width: 100
items:
- !scalebar
type: bar
maxSize: 100
barBgColor: white
fontSize: 8
align: right
- !text
font: Helvetica
fontSize: 9
align: right
text: '1:${scale} ${now MM.dd.yyyy}'
Best Answer
I had similar issue. Did exactly like you did. Later, I used GET and solved the issue. You just need to use encodeURI() before passing your json as the spec parameters. Try following:
UPDATE
If you want to download using post then you can do the following:
Notice that you don't have to use encodeURI() with this technique.
Hope it helps.