Question

I don’t have too much experience with JavaScript and Google Maps Api.
What I want to achieve:
I have a map, where user can either put marker or draw polygon. I’m using gmap3 plugin and I’ve managed to do everything I wanted with markers (like adding, editing, dragging, removing etc), but I have problem with polygons.
Here’s the basic code:

    $('#map-mappoints').gmap3(
    {
        action:'init',
        options:{
            zoom: 7
        }
        ,
        events: {
            click: function(event, data) {
                if($(".map #poly").hasClass('active')){
                    placePoly(data.latLng);
                } else {
                    placeMarker(data.latLng);
                }
            }
        }
    },
    {
        action:"autofit"
    }
    );


    function placePoly(location) {
        $('#map-mappoints').gmap3({ 
            action: 'addPolygon',
            options:{
                strokeColor: "#FF0000",
                strokeOpacity: 0.8,
                strokeWeight: 2,
                fillColor: "#FF0000",
                fillOpacity: 0.35
            },
            callback: function(polygon){
                var path = polygon.getPath();
                path.push(location);
                console.log(path);
            }
        }
        )
    } 

I can see in console that it creates poly, but it adds only one path element, which is logic as it’s triggered after each click on map, but I have no idea how I should make it to continue adding new elements to polygon, and then let user stop (probably by some button in toolbar), and create new after clicking “new poly”.

Thank you for any hints.

ps.
English is not my native language, so I’m sorry for any mistakes, I’ve tried to avoid them 😉

Answer 1

Read below the title Parameters of gmap3

http://gmap3.net/documentation.html

For it main use, gmap3 takes objects as parameters. Each object is an
action to execute. The actions are executed in their order in the
parameters list, and each time, once the previous is finished. This
example first initialise the google map, and then add two markers

path

The ordered sequence of coordinates that designates a closed loop. Unlike polylines, a polygon may consist of one or more paths. As a result, the paths property may specify one or more arrays of LatLng coordinates. Simple polygons may be defined using a single array of LatLngs. More complex polygons may specify an array of arrays. Any simple arrays are convered into MVCArrays. Inserting or removing LatLngs from the MVCArray will automatically update the polygon on the map.

The MVCArray is a mutable array, so you can add more lat,long coordinates to the array and the polygons will automatically be updated.

Hope this helps you out!

greetz