i have some dynamic actions on my website, so i need to write my own js.

Can anyone explain how to add a marker/poly with my own js to a certain gmap?

it would be wonderfull, if the gmap module provides sth like a api

Comments

jokerejoker’s picture

I need the same thing, some sort of JS API for the gmap module.

I need some custom code to use the panTo function from the google maps api?

ac00perw’s picture

This is a bit old, but Google makes it relevant (it came up first in my search) so I'll post what I've got so far. I have a custom module in which a menu hook spits out venues with longitudes and latitudes (from a separate db- could be nodes or what have you though). My javascript adds a movend listener which triggers a call to the custom module. Markers are then made on the fly based on my venues. I'd like it to be a little 'smarter' than it is though. e.g. it would be great to calculate the current map location and not regenerate markers unless the user moves to a new spot beyond.

Is there an easier way? What about control of marker icons? I was hoping the gmap module would be a help with the marker system is JS.

My .js file follows...

function initialize() {
  if (GBrowserIsCompatible()) {
    var m = Drupal.gmap.getMap('myMapID');
    if (m.map) {
        initDirection();
    }else{
        m.bind('ready', function(data) {
        initDirection();
      });
    }
  }
}

function initDirection() {
var map = Drupal.gmap.getMap('myMapID').map;

GEvent.addListener(map, "moveend", function() {
  var center = this.getCenter();
  var z= map.getZoom();
  
//check zoom level before populating. need better control than this. 
  if(z<11){
		$("#mapmessage").html('zoom in to refresh venues');
  }else{
		document.getElementById("mapmessage").innerHTML = z;
		$("#mapmessage").html('&nbsp;');
		addMatches(center);
 }
});

}

$(document).ready(function(){
  initialize();
})

function addMatches(center){

$("#mapmessage").html('calculating...');

$.ajax({type: 'GET',
      url: "/myajaxiancallback/"+center,
      dataType: 'json',
      success: makeMarkers,
      data: 'js=1' });
}

function makeMarkers(data, textStatus){
var map = Drupal.gmap.getMap('myMapID').map;
map.clearOverlays();

	var list="<p>";
	for(var i=0;i<data.length;i++){
	var d=data[i].split("|");
	

      var point = new GLatLng(d[1],d[2]);
      var marker = createMarker(point,d[3], d[0])
      map.addOverlay(marker);
	list+="<div class='entry'>"+ d[3] +'</div>';
	
	}
	list+='</p>';
	$("#results").html(list);
	 $("#mapmessage").html('&nbsp;');
}

function createMarker(point,html, icon) {
        var marker = new GMarker(point, icon);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        return marker;
}
johnv’s picture

Status: Active » Closed (won't fix)

Closing this very old issue. Please reopen if it is still valid.