Each predefined area will have a default style, which is applied when the areas are drawn on the map. To customize the default style of predefined areas, follow these steps:
- Edit your map.
- Scroll down to the section “Draw a Search Settings” and click on the menu “Predefined areas search”.
- Scroll down to the section “Areas default style”.
- Use the fields “Fill color”, “Stroke color”, “Fill opacity”, “Stroke opacity”, “Stroke weight” and “Stroke position” to customize the default style of predefined areas.
To hide a group of areas from the predefined areas list, do the following:
- Edit your map
- Scroll down to the widget “Draw a Search Settings” and click on the menu “Predefined areas settings”.
- Scroll down to the section “Area groups” and edit your areas group by clicking on its related group field.
- In the “Visibility” field, choose “Hide Group Only” to remove the group name from the predefined areas list while keeping its related areas visible. To hide both the group name and all its related areas, select “Hide Group and All Related Areas”.
To add/assign a predefined area to a group of areas, do the following:
- Edit your map
- Scroll to the widget “Draw a Search Settings” and click on the menu “Predefined areas settings”.
- Scroll down to the section “Areas” and edit your area by clicking on its related group field.
- In the field “Area group”, select the group to which you want to assing your area.
The plugin provides the possibility to split your predefined areas list into groups. Each group will contain a set of areas. To create a group of predefined areas, do the following:
- Edit your map
- Scroll to the widget “Draw a Search Settings” and click on the menu “Predefined areas settings”.
- Scroll down to the section “Area groups” and click on the group field “Group 1”.
- Enter the group name in the field “Group name”.
- In the field “Visibility”, select the option “Show”.
To add a new predefined area, follow these steps:
Step 1:
- Edit your map and open the “Draw a Search Settings” widget.
- Navigate to the “Predefined areas Search” menu.
Step 2: Add and Configure Predefined Areas
- Scroll to the “Areas” section. Click on the group field “Area 1” or “Add new area” for additional areas.
- In the “Area name” field, enter the area’s name or title. For example “London, UK”.
- In the “Area Group” field, assign your area to a group if necessary; otherwise, choose the “None” option.
- Enter the area coordinates in the “Area/Polygon Paths” field using the format [Lat,Lng] or [Lng,Lat]. Example:
[45.5215,-1.5245],[41.2587,-1.2479],[40.1649,-1.9879]
Select the coordinates format in the field “LatLngs order”. Refer to the instructions in “Step 4” below to ensure the proper placement and display of your areas!
- In the “Visibility” field, select whether the area should be visible by default on the map by choosing “Show” or “Hide”. Alternatively, to make the area visible and automatically selected when the map loads, choose “Show & Automatically Select on Map Load”.
- In the “Area/Polygon Style” field, select whether to use the default polygon/area style or to customize the style specifically for this area. To apply the default style, choose “Default Style”. If you prefer a custom style, select “Custom Style” and configure the options in the “Area Custom Style” section. Adjust the fields for “Fill Color”, “Stroke Color”, “Fill Opacity”, “Stroke Opacity”, “Stroke Weight”, and “Stroke Position” as needed.
Step 3: Adding More Predefined Areas
Click “Add new area” and repeat the steps above for additional areas, or save your map settings if you’ve finished adding areas.
Step 4: Verify Areas Placement
To ensure that the added areas appear correctly on the frontend map, it is important to confirm that the coordinates are in the “Latitude” followed by “Longitude” format. If you have copied coordinates from a service, they are likely in reverse order (“Longitude, Latitude”), which may cause the polygons to display incorrectly or not appear at all.
To resolve this issue, follow these steps:
-
- After adding your areas, save the map settings.
- Revisit the map settings and review each area by opening the area widget to confirm their placement on the map.
- If an area is misplaced, it may have reversed coordinates. In this case, click the “Reverse coordinates” button at the top of the map. This tool quickly reverses the order of all area vertices.
- Once the area appears correctly on the map, click “Update/Display polygon coordinates” to save the changes.
- Save your map settings after verifying the placement of all areas.
By taking these steps, you ensure your areas are displayed accurately on the frontend map.
To increase or decrease the predefined areas list width and to change list placeholder, do the following:
- Edit your map
- Scroll down to the widget “Draw a Search Settings” and click on the menu “Predefined areas search”.
- In the field “Search field width”, change the list width.
- In the field “Search field placeholder”, change the list placeholder.
Users can select one or multiple predefined areas in the list. The default behavior is single area search. To allow multiple areas search, do the following:
- Edit your map
- Scroll down to the widget “Draw a Search Settings” and click on the menu “Predefined areas search”.
- In the field “Search by multiple areas”, select the option “Yes”.
To automatically open the predefined areas list once the map is loaded, do the following:
- Edit your map
- Scroll down to the widget “Draw a Search Settings” and click on the menu “Predefined areas search”.
- In the field “Display status”, select the option “Yes”.
This guide will help you set up and enable the “Predefined Areas Search” tool for your map.
- Edit Your Map
- Scroll down to the widget labeled “Draw a Search Settings” and click on the menu “Predefined Areas Search”.
- Enable the Tool
- In the field “Predefined Areas Search Option”, select “Yes”.
- Automatic List Display
- To automatically open the predefined areas list when the map loads, set the “Display Status” field to “Yes”.
- Allow Multiple Area Selection
- By default, users can search within a single area. To enable multiple area selection, set the “Search by Multiple Areas” field to “Yes”.
- Customize List Width and Placeholder
- To adjust the width of the predefined areas list, use the “Search Field Width” field.
- To modify the list placeholder text, update the “Search Field Placeholder” field.