GISRSStudy » QGIS » QGIS2Web

QGIS2Web Tutorial

What is QGIS2Web?

QGIS2Web is a plugin for allows you to export your map. If you don’t have your own web server, then QGIS Cloud offers this service with a free version available.

QGIS plugin to export your project to an OpenLayers, Leaflet, or Mapbox GL JS web map, so you can view it interactively on the web with no programming skills.

Usage

  • Set your project title, and background and highlight colors.
  • Give your layers and layer columns human-friendly names in the Layers Panel.
  • Hide the columns you don’t want to appear in your popups by changing their Edit widget to ‘Hidden’.
  • If any of your fields contain image filenames, change their Edit widget to ‘Photo’ to have the images appear in pop-ups.
  • Style your layers, and set their scale-dependent visibility (if required).

QGIS2Web Plugin

First, you need to download and install the QGIS 2 Web plugin.

1. Go to Plugins Menu > Manage and Install Plugins.

2. In the Plugins Window, search for qgis2web, then click the Install button.

After the installation process is complete, you should be able to find qgis 2 web in the main menu under the Web.

There are 4 important tabs available in qgis 2 web panel:

  1. Layers and Groups
  2. Appearance
  3. Export
  4. Settings

QGIS2Web Tutorial

1. First, Add the Data in QGIS Layer panel, and map canvas.

Also, you can add the Basemap (OpenStreetMap).

2. Now Open QGIS 2 Web, go to Web > QGIS2Web > Create a web map.

3. QGIS 2 Web panel appear, show all the added data in the Layers and Groups tab.

4. Now choose the web format in which you went export your map; OpenLayers, Leaflet, or Mapbox GL JS.

[Note: You can also select the destination folder, as you want to export the web map, in the Export tab.]

5. Finally click the Export button, to build a web map package to the folder location you select.

After it finishes exporting, image, layers, resources, and styles, all the file HTML that gets presented on the screen.

Leave a Comment

Your email address will not be published. Required fields are marked *

Tutorial Contents
Scroll to Top