Draw polylines on the map


To draw polylines on your map, do the following:

Step 1:

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

Step 2:

  1. Scroll down to the section “Polylines”, then, click on the group field “Polyline 1” (or click on the button “Add new polyline” if this is not your first polyline).
  2. Enter your polyline name/title in the field “Polyline Label”.
  3. Enter the unique name/key/ID of your polyline in the field “Polyline ID/Name”. Do not use the same name/key/ID for multiple polylines on the same map!
  4. Specify the polyline points type in the field “Polyline points type”, then, draw your polyline using one of these methods:
    • 1st Method: Draw a polyline by connecting multiple posts already available on the map:
        1. In this field, select the option “Post IDs”.
        2. In the field “Polyline Path (Post IDs)”, select the posts that will be used/connected to form your polyline. You should add at least 2 posts!
    • 2nd Method: Draw a polyline by providing the “lat,lng” coordinates:
        1. In this field, select the option “Lat,Lng”.
        2. Open the group field “Polyline Path [Lat,Lng]” and enter or paste the polyline coordinates in the field/textarea “Polyline 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 polyline in the plugin settings:
        1. In this field, select the option “Lat,Lng”.
        2. Open the group field “Polyline Path [Lat,Lng]” and draw your polyline. Since version 5.2, a new feature has been added allowing you to easly draw your polylines. 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 “Polyline options”.
    1. Choose whether this Polyline handles mouse events or not by choosing an option in the field “Clickable”.
    2. If your polyline is clickable, you may want to open a link when the user clicks on it. Paste your polyline link in the field “Polyline redirect URL”, then, choose how to open the link in the field “URL target”.
    3. Enter the polyline description in the field “Polyline description”. The description will be displayed inside an infobox when the user hover over the polyline. For this to appear, your polyline must be clickable!
    4. Enter the maximum width (in pixels) of the infobox that will contain the polyline description in the field “Infowindow Maximum width”.
    5. Choose whether your polyline should follow the curvator of the earth or not by selecting an option in the field “Geodesic”.
    6. Enter the z-index of your polyline in the field “z-index”.
    7. Hide and/or show your polyline on the map by choosing an option in the field “Visibility”.
  6. To customize your polyline style, open the group field “Polyline style”.
    1. Modify the colors and values in the fields “Stroke color”“Stroke opacity” and “Stroke weight”.
    2. In the field “Stroke type”, choose the polyline stroke type. You can draw linear polylines or dashed polylines!
  7. To add a new polyline, click on the button “Add new polyline”, then, repeat the steps above.

In the same context