GeoNetwork Integration - geosolutions-it/MapStore GitHub Wiki

How to use MapStore as GeoNetwork viewer

MapStore can be used as an alternative GeoNetwork Viewer. In this case you can have all the advanced MapComposer features on GeoNetwork !

Obviously, in order to use MapStore in this way, you have to use also a dedicated GeoNetwork version containing all the necessary customizations that allow the integration.

Currently the required GeoNetwork customizations are provided by GeoSolutions for our own GeoNetwork fork on Github, inside the most recent RNDT branch. So, first you have to download the mapstore-rndt GeoNetwork from the URL below:

https://github.com/geosolutions-it/core-geonetwork ( switch into the mapstore-rndt branch ).

or downlaod the WAR file from the link below:

http://demo.geo-solutions.it/share/github/mapstore/downloads/war/geonetwork/2.6.5/geonetwork-2.6.5.war

This is a GeoSolutions customized version. After the download you have to rename the file as 'geonetwork.war'.

Then, when you have the proper GeoNetwork version, you have to prepare MapStore to run with it:

  1. Go to the

    you@prompt:~$ cd mapstore/mapcomposer/app

and edit the 'config.js' file decommenting the following line at the top of the file:

[(/^\/(geonetwork)/), require("./root/geonetwork").app], // Enable this only for the GeoNetwork integration

  1. Go to the

    you@prompt:~$ cd mapstore/mapcomposer/app/static/config

and edit 'gnBaseUrl' property of the geonetwork.js configuration file specifying your GeoNetwork URL at this line:

"gnBaseUrl": "http://localhost:8080/geonetwork/"

NOTE: GeoNetwork and MapStore must be deployed in the same container.

After these configurations the MapStore Viewer with a GeoNetwork integration is available at the URL below:

 http://localhost:8080/mapcomposer/geonetwork

Banner customizations

By default the 'geonetwork' mapstore template, located at:

 you@prompt:~$ cd mapstore/mapcomposer/app/template

defines its own banner. You can modify the banner using your configuration simply editing the script below:

 // ///////////////////////////////////
 // Header definition
 // ///////////////////////////////////
 var headerContent = [
'			<div class="topbanner">',
'				<div class="main">',
'					<div class="header">',
'						<div class="logo-gs-white"><a href="http://www.geo-solutions.it/"><img src="theme/app/img/banner/geosolutions-logo-whitebg.png" alt="GeoSolutions"></a></div>',
'						<div class="logo-ms-white"><a href="http://mapstore.geo-solutions.it/"><img src="theme/app/img/banner/mapstore-banner.png" alt="MapStore"></a></div>',

'					</div>',
'				</div>',
'			</div>'
 ];

This script refers the custom.css file to manage all the style aspect related to the banner in question. this file is located at:

 you@prompt:~$ cd mapstore/mapcomposer/app/static/theme/app

and the related images are located at the path below:

 you@prompt:~$ cd mapstore/mapcomposer/app/static/theme/app/img/banner

So you can define your owns images and styles for your banner overwriting the default settings.

⚠️ **GitHub.com Fallback** ⚠️