Save and Delete markers using Google map API V3

I got a trouble using GMAP V3, when I realized that I need to save the changes in the map in a database, I found no way to do that. Before start to workaround I would like to listen some ideas firsrt.. and there no better place to do this, the comunnity stackoverflow always gave me great ideas to solve the 开发者_如何学JAVAproblems and I m sure that will not be different.

Well,

I have a script to mesure the elevation of a region and I have also pointed something by hand in my own code, follow the example:

  var examples = [{
    latlngs: [
      [-24.116537, -49.358257],
      [-24.123348, -49.344267],
      [-24.122409, -49.329212],
      [-24.116478, -49.306664],
      [-24.101001, -49.313376],
      [-24.095218, -49.333645]
    ],
    mapType: google.maps.MapTypeId.SATELLITE,
    travelMode: 'direct'
    }, {
    latlngs: [
      [-23.991412, -48.894621],
      [-23.969345, -48.884353],
  [-23.973734, -48.855789],
  [-23.996274, -48.860673],
  [-24.00085, -48.886786]
    ]
    mapType: google.maps.MapTypeId.SATELLITE,
    travelMode: 'direct'
   }];

Then a initialize everything:

  function initialize() {
    var myLatlng = new google.maps.LatLng(15, 0);
    var myOptions = {
      zoom: 1,
      center: myLatlng,
      mapTypeControl: true,
      mapTypeId: google.maps.MapTypeId.TERRAIN
    }

Now I have the function to add markers on the map

// Add a marker and trigger recalculation of the path and elevation
  function addMarker(latlng, doQuery) {
    if (markers.length < 100) {

      var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        draggable: true
      })

      google.maps.event.addListener(marker, 'dragend', function(e) {
        updateElevation();
      });

      markers.push(marker);

      if (doQuery) {
        updateElevation();
      }

      if (markers.length == 100) {
        document.getElementById('address').disabled = true;
      }
    } else {
      alert("Apenas 100 pontos podem ser adicionados.");
    }
  }

'til here everything works fine, but I need to add some functionalities to the map. I need to add a new marker and a save button to the map, 'cause I need the new changes go to my database.. I just want to know if there are some function in GMAP API, then I do not need to re-invent the wheel..

Another problem, I need to delete only one marker, I do already, but only to all markers, and now I need only one to delete.

I think in the function addMarker with var marker I can use to put the values in a database, but how?

I recommend that you take a look at your code and find ways to decouple these features. For instance you can wrap the google maps api and make it generic. For instance here is one that I wrote:

http://bobcravens.com/files/gmap3/0.1/jquery.gmap3.js

In this wrapper you can see an example of how to add/delete individual markers.

The other area to keep separate is your database interactions. These can be done using AJAX. Here, I recommend you pull in a library that normalizes the differences between browsers. I personally like jQuery for this. I would put all my database calls into a javascript object. Or at least put the db calls in the 'save' button event handler. The AJAX calls with jQuery look something like:

var data = {};
data.lat = 89.0;
data.lng = -10.0;
data.name = 'marker name';
$.ajax({
    url: 'api/1.0/markers/save.php',
    type: 'post',
    data: data,
    error: function(){
        alert('Error on ajax.');
    },
    success: function(data){
       alert('success...do other stuff here');
    }
});

Hope this helps.

Bob