Hi All,
I need an quick help form you guys. I am developing a map for
logistic department and I am facing problem In displaying different
content in infowindow when user click on different markers and same
for the tooltip also. I am fetching data form the database and
spliting them in to an array. The data contain the ports name means
the place where vessel will stop, country name, date of arrival and
date of depature. I am able to create different marker at different
location, but I want to show these thing in tooltip and in infowindow
like when user mouse over on the marker he should see the name of the
port, country name, date of arrival and date of depature. Even he
should see the same in infowindow when he click on the perticular
markers. Currently I am able to see only the last content in the
array.
My code is as follow
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 5,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
codearrayofaddresses();
}
//This function will take the array of locations and set the marker
//to all those locations. It will also call the function addLatLng()
to draw polylines.
function codearrayofaddresses()
{
<%
for (int i=0; i< vScheduleList.size(); i++) { %>
//alert("in for loop before");
<%vSchedule1 = (VesselVoyageSchedule)vScheduleList.get(i); %>
//alert("in for loop after");
portarray[<%=i%>] = "<%=(String)vSchedule1.getPort()%>";
country_array[<%=i%>] = "<%=(String)vSchedule1.getCountry()%>";
arr_date_array[<%=i%>] = "<%=(String)vSchedule1.getArrDate()%>";
dep_date_array[<%=i%>] = "<%=(String)vSchedule1.getDepDate()%>";
voyage_sailed[<%=i%>] = "<%=vSchedule1.hasSailed()%>";
//alert("in for loop after1");
<%}%>
var portList = portarray;
initializePolyline();
for ( var i=0; i<portList.length; i++ )
{
var location = portList[i];
var country = country_array[i];
var arrdate = arr_date_array[i];
var depdate = dep_date_array[i];
voy_sailed = voyage_sailed[i];
var tooltip = location + ", " + country + "\n" +" ETA: "+
arrdate +
" ETD: "+ depdate;
geocoder.geocode( { 'address': location}, function(results,
status)
{
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
setMarker(results[0].geometry.location, tooltip,
voy_sailed);
addLatLng(results[0].geometry.location);
}
else {
alert("Geocode was not successful for the following
reason: " +
status);
}
});
}
}
function setMarker(latlong, tooltip1, voy_sailed)
{
var latlong = latlong;
var sailed = voy_sailed;
marker_image = getMarkerImage(sailed);
var tooltip = tooltip1;
alert(tooltip);
//var tooltip = port_name + ", " + country_name + "\n" +" ETA:
"+arrdate + " ETD: "+depdate;
var shadow = new google.maps.MarkerImage(marker_image,
new google.maps.Size(37, 32),
new google.maps.Point(0,0),
new google.maps.Point(0, 20));
marker = new google.maps.Marker({
map: map,
position: latlong,
icon: marker_image,
title: tooltip,
shadow : shadow
});
markersArray.push(marker);
infowindow = new google.maps.InfoWindow({content: tooltip });
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker)});
}
//Get the marker image and display on the map.
function getMarkerImage(sailed)
{
var image;
<%if (vSchedule1.hasSailed())
{%>
image = new google.maps.MarkerImage('images/onebit_10.png', new
google.maps.Size(10, 25));
<%}
else{%>
image = new google.maps.MarkerImage('images/onebit_06.png', new
google.maps.Size(10, 25));
<%}%>
return image;
}
//This function will initialize Polyline
function initializePolyline() {
var polyOptions = {
strokeColor: '#FF0000',
strokeOpacity: 1.0,
strokeWeight: 1
}
poly = new google.maps.Polyline(polyOptions);
poly.setMap(map);
}
//For showing Poliline at the location user specified
function addLatLng(latlng) {
var path = poly.getPath();
// Because path is an MVCArray, we can simply append a new
coordinate
// and it will automatically appear
path.push(latlng);
polyArray.push(poly);
}
I think there is a problem in function codearrayofaddresses() and in
setMarker() while setting tooltip or infowindow other function are
working fine. Please help me its very urgent.
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
