Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
This manual is for developers who want to use JMap NG to create map visualization applications for the web, integrate mapping capabilities into their web applications or extend existing JMap NG tools. JMap NG connects to your instance of JMap Server and opens JMap projects.
Depending on the needs, one of two different approaches may be selected: using JMap NG Core or using JMap NG App.
Both JMap NG Core and JMap NG App can be easily embedded in you web applications or web sites. This manual explains how to do it and provides running examples that you can use to get started.
It’s a library for building map visualization applications for the web. It connects to a JMap Server instance to load and display a map project. It is based on the MapLibre GL JS open source project. It does not include any UI except for the mouseover popups and basic map controls. It is useful when you need only the map but want to build your own UI around it.
JMap NG Core provides a JavaScript API to perform simple tasks and JMap related tasks like getting a JMap Project, managing layers and accessing feature attributes. It also exposes the full MapLibre GL JS API for other tasks.
The latest version of the JMap NG Core Javascript API documentation is available here.
It’s a complete map visualization application based on JMap NG Core. It provides a complete UI with many ready to use tools such as measuring, selecting, editing features, printing. It does not require any programming but provides a JavaScript API and can be extended by writing JMap NG extensions. JMap NG extensions are modules that plug easily into JMap NG to extend its capabilities, perform custom tasks or to support the integration of JMap NG into another web application.
The latest version JMap NG App Javascript API documentation is available here.
Extensions are plug-ins for JMap NG App that extend its functionalities. With the JMap NG API, you can develop your own extensions.
Extensions can add their own UI, typically an icon and a side panel. It is possible to have extensions with a different UI and even with no UI at all.
Extension life cycle
Extensions are being "registered" by NG in 2 different ways:
The registering process most importantly includes incorporating your extension's redux reducers, if provided, your translation bundle, if provided, and the extension service to expose, if provided.
When NG registers your extension, it automatically calls your extension's initFn
and onPanelCreation
methods. In your initFn
or onPanelCreation
method, you can handle all your extension's initializing process. Once the initFn
method is called, you can start calling NG's API to communicate with it.
Extension unique ID
The Extension Unique ID serves a dual purpose for NG: it used by NG to identifiy and manage the loading process of extensions, while also establishing a connection with a server-side extension. This connection can link your extension to specific JMap projects, optionally allowing for the transmission of configuration data to your extension during project loading. The nature of your unique id thus depends on your way of deploying it.
How to deploy your extension
Once your extension is ready to deploy, you can compile it and host it on any CDN of your choice. If your extension is loaded via a project, the URL of your CDN will be configured in the server-side part of your extension. If you include your extension as a <script>
tag in an HTML page, you will be able to use the CDN's url. In all cases, this url should always be accessible from the location where NG will run.
NG Extensions are javascript objects that respect an interface (either or ) and that are loaded by NG at application startup or project load, depending on the type of the extension. Every extension must have a unique id
property, a initFn
implementation, if implementing , and a onPanelCreation
implementation if implementing .
if included in the JMap NG , they will be automatically registered by NG.
If loaded from a javascript <script>
tag or via a project load, the extension must register itself. This is typically done in the extension "entry point" by calling the method, for a Core extension, or method, for an Application extension.
You can see a full extension example .