Question

This demo creates markers at random points on map:
http://gmap3.net/examples/pan-to-markers.html

Whats the smallest modification I can make to the demo code so I can specify the longitude and latitude of the points instead of having them random?

NOTE The exact code I have is slightly different to the demo in the link:

    $('#test1').gmap3(
      { action: 'init',
        center:{
            lat:44.797916, 
            lng:-93.278046
        },
        onces: {
          bounds_changed: function(){
            $(this).gmap3({
              action:'getBounds', 
              callback: function (bounds){
                if (!bounds) return;
                var southWest = bounds.getSouthWest(),
                    northEast = bounds.getNorthEast(),
                    lngSpan = northEast.lng() - southWest.lng(),
                    latSpan = northEast.lat() - southWest.lat(),
                    i;
                for (i = 0; i < 10; i++) {
                  add($(this), i, southWest.lat() + latSpan * Math.random(), southWest.lng() + lngSpan * Math.random());
                }
              }
            });
          }
        }
      }
    );

  });

Here is the code im actually using. I know its hacky but this is just for a demo.
http://smartpeopletalkfast.co.uk/gmap/demo/overlay.html

Answer 1

If you want to create your own set of points, you’d want to do something along the following lines:

// create a set of lat/lng points. Replace x/y with your own lat/lngs
var points = [
    [x, y],
    [x, y],
    [x, y],
    [x, y],
    [x, y],
    [x, y],
    [x, y]
];

$('#test').gmap3(
{ action: 'init',
  center:[44.797916,-93.278046],
  onces: {
    bounds_changed: function(){
      $(this).gmap3({
        action:'getBounds', 
        callback: function (bounds){
          if (!bounds) return;
            var southWest = bounds.getSouthWest();
            var northEast = bounds.getNorthEast();
            var lngSpan = northEast.lng() - southWest.lng();
            var latSpan = northEast.lat() - southWest.lat();
            for (var i = 0; i < points.length; i++) {
             // instead use the points you previously defined
             add($(this), i, points[i][0], points[i][1]);
          }
        }
      });
    }
  }
}
);