-

Geoserver Map Fish Print Configuration & Example Script


index. html



 <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.3.1/css/ol.css" type="text/css">
    <style>
      .map {
        height: 400px;
        width: 100%;
      }
    </style>
    <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.3.1/build/ol.js"></script>
 
<title>OpenLayers example</title>
  </head>
<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/test/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:'tiger',
   source: new ol.source.TileWMS({
     projection : projection1,
     url: URL,         
     params: {
        LAYERS: 'test:IND_water_areas'
     },
     serverType: 'geoserver'
   }),
   name: 'tiger',
     isBaseLayer: false
   });

 var map = new ol.Map({
   layers: [baseLayer, Nepal],
   target: 'map',
   view: new ol.View({
     center : newpos,
     zoom: 7
   })
 });
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src ='mapprint.js'></script>


mapprint.js 


function showFile(blob){
  // It is necessary to create a new blob object with mime-type explicitly set
  // otherwise only Chrome works like it should
  var newBlob = new Blob([blob], {type: "application/pdf"})
            var url = window.URL || window.webkitURL;

  // IE doesn't allow using a blob object directly as link href
  // instead it is necessary to use msSaveOrOpenBlob
  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(newBlob);
    return;
  }

  // For other browsers:
  // Create a link pointing to the ObjectURL containing the blob.
  const data = url.createObjectURL(newBlob);
  var link = document.createElement('a');
  link.href = data;
  link.download="file.pdf";
  link.click();
  setTimeout(function(){
    // For Firefox it is necessary to delay revoking the ObjectURL
    url.revokeObjectURL(data);
  }, 100);
}
var specs={
 "layout":"A4 portrait",
 "srs":"EPSG:4326",
 "units":"degrees",
 "dpi":150,
 "mapTitle":"test",
 "mapcomment":"test",
 "layers":[
 {
    "baseURL":"http://localhost:9090/geoserver/test/wms",
    "opacity":1.0,
    "singleTile":false,
    "type":"WMS",
   "layers":["test:IND_water_areas"],
    "format":"image/png"
 }
 ],
 "pages":[
 {
    "center":[84.2,28.2],
    "scale":2000000,
"comment":"test"
 }
 ]
};

$("#export-pdf").click(function(){
var json = JSON.stringify(specs);
alert(json);
$.ajax(
{
  url:'http://localhost:9090/geoserver/pdf/print.pdf',
  type: 'GET',
    xhrFields: {
            responseType: 'blob'
        },
  data:
  {
    spec: json
  },
  success: function(response)
  {
showFile(response)       
  },
  error: function()
  {
    alert("Failure");
  }
});
});

Before proceeding further , download geoserver-print-module related to geoserver version

Extract the zip file and place the jar files in geoserver/WEB-INF/lib folder

Then restart the geoserver once.



You may change the config.yaml file in geoserver data_dir/printing 

 Now you can test the app by opening the index.html file 

Comments

Post a Comment

Popular posts from this blog

-
Node Js Non-Blocking IO Overview of Blocking vs Non-Blocking This overview covers the difference between  blocking  and  non-blocking  calls in Node.js. This overview will refer to the event loop and libuv but no prior knowledge of those topics is required. Readers are assumed to have a basic understanding of the JavaScript language and Node.js  callback pattern . "I/O" refers primarily to interaction with the system's disk and network supported by  libuv . Blocking Blocking  is when the execution of additional JavaScript in the Node.js process must wait until a non-JavaScript operation completes. This happens because the event loop is unable to continue running JavaScript while a  blocking  operation is occurring. In Node.js, JavaScript that exhibits poor performance due to being CPU intensive rather than waiting on a non-JavaScript operation, such as I/O, isn't typically referred to as  blocking . Synchronous methods in t...
Read more
-
Python for Everyone Course  Link :  http://www.py4inf.com/ Book with all materials and lessons :  https://www.py4e.com/ PPTS :
Read more
-
Geoserver Print Module Geoserver print process involves two steps. First at the  server side , you have to configure your yaml file, called config.yaml. Go through the detailed documentation at  MapFish print module documentation page . Once this done, the second step is for  client side . Considering you are using openlayers for your front-end, in order to get the list of visible layers, you will need a simple loop with visibility check, e.g. 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 ); 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 ...
Read more