How to draw a circle on google map

To draw a circle on Map using Toolset Map – you can use hook js_event_wpv_addon_maps_init_map_completed.

Add the following code to content template’s JS box and change the mapid and center value as per actual requirement.

jQuery(document).ready(function ($) {

    $(document).on('js_event_wpv_addon_maps_init_map_completed', function (event, event_settings) {
        // Get the map using our .get_map() method...
        var mapid = 'map-11';
        var myMap = WPViews.view_addon_maps.get_map(mapid);

        // center value
        var center = new google.maps.LatLng(21.7644725, 72.1519304);

        // And then use Maps API .setOptions() method to programmatically change any option on the map.
        var coverageCircle = new google.maps.Circle({
            strokeColor: '#FF0000',
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: '#FF0000',
            fillOpacity: 0.35,
            map: myMap,
            center: center,
            radius: 100,
        });
    });
});

Let us know if this snippet is not working for you:

This snippet doesn’t work
0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments