Rapid Web GIS apps development using NextGIS frontend libraries

We’re happy to announce a new way to interact with our services and products – our cloud Web GIS nextgis.com, server GIS NextGIS Web and QuickMapServices!

As you might have noticed, in recent years we’ve focused mostly on end-user tools. This news is for developers. Today we’re releasing a suite of frontend JavaScript-libraries that allow you to build your own apps using our software and services as a backend.

Main purpose of the new libraries is to simplify usage of NextGIS Web resources and to speed up the development of Web GIS application of varying complexity levels.

A minimum amount of JS code needed to create a map showing 1) layers loaded from a previously created Web map and 2) a basemap from QMS catalog (see this example in action)

Different mapping frameworks are supported allowing to substitute one another with minimal changes to the code. Here is an example of the same map (a basemap + several vector layers) created with different mapping libraries:
Mapbox GL JS

Main features:
— ease of use
— same interface for different mapping frameworks
— optimized workflows for main mapping tools
— data in different NextGIS services all in one place
— convenient distribution (CDN, npm, git)

Packages and modules

We’re currently releasing a total of 14 libraries which can be described as packages or modules.

A package is a library that implements a simple way to create a map. A package may contain several modules or 3rd-party libraries and is ready to be used without installing any additional dependencies. Scripts, styles and images might also be included to be distributed as a single file through CDN or other means.

Current packages are:

  1. ngw-leaflet, ngw-ol and ngw-mapbox – packages for three main open-source mapping frameworks with common interfaces and means to manage NextGIS Web resources.
  2. ngw-connector – makes requests to NGW API, handles users authorization. This library is not connected to a map and deals only with data.
  3. ngw-uploader – uploads data, creates resources, layers, styles and services in NextGIS Web.
Dependency tree for NextGIS frontend libraries

A module is a building block prepared to be imported into an application with a build mechanism, such as Webpack. Supports TypeScript typization.

Current modules are:

  1. webmap – a common module that provides an abstract representation of a map, its layers and states. It has no dependencies and not linked to NextGIS services.
  2. adapters: leaflet-map-adapter, ol-map-adapter and mapboxgl-map-adapter – provide common interface for managing different mapping frameworks via webmap.
  3. ngw-map – similar to webmap, but with set NextGIS service interaction. Allows to implement typical use-cases for the Web maps with minimum code.
  4. External services interfaces: ngw-kit and qms-kit – extend a webmap to integrate with:
    1. nextgis.com/NextGIS Web to upload resources and Web maps;
    2. QuickMapServices for quick adding of basemaps.
  5. icons – a set of customizable svg-icons for point data (only for leaflet-map-adapter yet).
  6. dialog – modal windows.


code.nextgis.com aggregates components descriptions and code samples. Most of the libraries can be tested in action and you can test changes to this code in codepen. We continue to expand this set.

NextGIS Web interaction

Our libraries work via API with data stored in nextgis.com/NextGIS Web backend. To make most use of the libraries you’ll need a cloud Web GIS created at nextgis.com or your own NextGIS Web server. The cloud Web GIS needs to be on Mini or Premium plan. Set up CORS in your Web GIS settings and list domains where your code is hosted.

You can create a cloud-based Web GIS on your own by purchasing Premium.

Buy Premium

Libraries are written in TypeScript, packaged with Lerna and Yarn, built with Webpack. The code is available on GitHub under GPL v.3.0. Please report bugs through issues or contacts.

Comments are closed.