Draw polygons (shapes) on the map

To draw polygons on your map, do the following:

Step 1:

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

Step 2:

  1. Scroll down to the section “Polygons”, then, click on the group field “Polygon 1” (or click on the button “Add new polygon” if this is not your first polygon).
  2. Enter your polygon name/title in the field “Polygon Label”.
  3. Enter the unique name/key/ID of your polygon in the field “Polygon ID/Name”. Do not use the same name/key/ID for multiple polygons on the same map!
  4. Specify the polygon points type in the field “Polygon points type”, then, draw your polygon using one of these methods:
    • 1st Method: Draw a polygon by connecting multiple posts already available on the map:
        1. In this field, select the option “Post IDs”.
        2. In the field “Polygon Paths (Post IDs)”, select the posts that will be used/connected to form your polygon. You should add at least 3 posts!
    • 2nd Method: Draw a polygon by providing the “lat,lng” coordinates:
        1. In this field, select the option “Lat,Lng”.
        2. Open the group field “Polygon Paths [Lat,Lng]” and enter or paste the polygon coordinates in the field/textarea “Polygon coordinates” by putting each line segment (LatLng) as [Lat,Lng] or [Lng,Lat] seperated by comma. For example, [45.5215,-1.5245],[41.2587,-1.2479],[40.1649,-1.9879]
        3. Select the coordinates format in the field “LatLngs order”.
    • 3rd Method: Draw your polygon in the plugin settings:
        1. In this field, select the option “Lat,Lng”.
        2. Open the group field “Polygon Paths [Lat,Lng]” and draw your polygon. Since version 5.2, a new feature has been added allowing you to easly draw your polygons. All the inscructions you’ll need to use that drawing tool can be found under that field. Read the insctructions and start drawing!
  5. Once finished drawing, scroll down and open the group field “Polygon options”.
    1. Choose whether this polygon handles mouse events or not by choosing an option in the field “Clickable”.
    2. If your polygon is clickable, you may want to open a link when the user clicks on it. Paste your polygon link in the field “Polygon redirect URL”, then, choose how to open the link in the field “URL target”.
    3. Enter the polygon description in the field “Polygon description”. The description will be displayed inside an infobox when the user hover over the polygon. For this to appear, your polygon must be clickable!
    4. Enter the maximum width (in pixels) of the infobox that will contain the polygon description in the field “Infowindow Maximum width”.
    5. Choose whether your polygon should follow the curvator of the earth or not by selecting an option in the field “Geodesic”.
    6. Enter the z-index of your polygon in the field “z-index”.
    7. Hide and/or show your polygon on the map by choosing an option in the field “Visibility”.
  6. To customize your polygon style, open the group field “Polygon style”.
    1. Modify the colors and values in the fields “Fill color”, “Fill opacity” and “Stroke color”, “Stroke opacity”, “Stroke weight” and “Stroke Position”.
    2. In the field “Stroke type”, choose the polygon stroke type. You can draw linear polygons or dashed polygons!
    3. Customize the polygon style on hover/mouse enter #.
  7. To add a new polygon, click on the button “Add new polygon”, then, repeat the steps above.

In the same context