Render images on the map


Note: This feature has been first introduced in version 3.5!

The plugin provides the possibility to use the ground overlays in order to place images on the map. The image will be rendered on the map, constrained to the given bounds, and conformed using the map’s projection. You can add multiple images on a single map. To place an image on your map, do the following:

Step 1:

  1. Edit a map
  2. Open the widget “Progress Map Settings”.
  3. Click on the menu “Ground overlays settings”.
  4. Select the option “Yes” in the field Ground overlays option”.

Step 2:

  1. Scroll down to the section “Images (Ground Overlays)”, then, click on the group field “Image 1” (or click on the button “Add new image” if this is not your first ground overlay).
  2. Identify your image by giving it a name/label in the field “Image Label”.
  3. Open the group field Image overlay URL & Bounds” and create your ground overlay using one of these two methods:
    • 1st Method: If you already know the image bounds:
        1. Upload your image or paste its URL in the field “Image URL”.
        2. In the field North-East coordinates”, enter the Latitude & Longitude of the top-right corner of the image. In other words, the location where you want the top-right corner of the image to be.
        3. In the field “South-West coordinates, enter the Latitude & Longitude of the bottom-left corner of the image. In other words, the location where you want the bottom-left corner of the image to be.
    • 2nd Method: Find the image overlay bounds in the plugin settings. Since version 5.2, a new feature has been added allowing you to easly find your ground overlay bounds. All the inscructions you’ll need to use that drawing tool can be found under that field. Read the insctructions and start drawing!
  4. Open the group field “Image options”.
  5. Select the image opacity in the field “Image opacity”.
  6. Specify the image visibility in the field “Visibility”.
    • The option “Always visible” will display the image on the map and users won’t be able to hide it.
    • The option  will hide the image once the map is loaded but users will have the possibility to show it.
    • The option “Show on map load and allow users to hide & show it when they want” will display the image once the map is loaded and users will have the possibility to hide & show it.
    • The option “Disable” will deactivate the image.
  7. The button that hides & shows the image will be displayed on the top-right corner of the map (The coordinates in the field “North-East Image Bounds”). If you don’t like the position of the button, specify the coordinates of the location where you want it to be in the field “Icon position”.
  8. If you don’t like the button icons, you can change them from the fields “Show buttom icon” and “Hide buttom icon”.
  9. To add a new image overlay, click on the button “Add new image”, then, repeat the steps above.

In the same context