Hello,
I'm am having some problems with creating custom markers for my
entries in a fusion table. Here is the link (http://
www.advocacy.ucla.edu/Maps/communitybanners/communitybanner_locations.html)
and below is the code, any ideas why this isn't working?
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /
>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Community Programs</title>
<style>
body { font-family: Arial, sans-serif; }
#map_canvas { height: 600px; width:700px; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?
sensor=false"></script>
<script type="text/javascript" src="http://www.google.com/jsapi";></
script>
<script type="text/javascript" id="script">
google.load('visualization', '1');
var tableid = 2177811;
var map;
var lastWindow;
function initialize() {
map = new google.maps.Map(document.getElementById('map_canvas'), {
center: new google.maps.LatLng(34.30941257937057,
-118.1689453125),
zoom: 9,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
setData();
}
function setData() {
// Create a Chart Tools query to send to Fusion Tables
var query = new google.visualization.Query(
'http://www.google.com/fusiontables/gvizdata?tq=' +
encodeURIComponent("SELECT 'geometry' FROM 2177811")
);
query.send(getData);
}
// Define callback function, this is called when the results are
returned
function getData(response) {
// For more information on the response object, see the
documentation
//
http://code.google.com/apis/visualization/documentation/reference.html#QueryResponse
var numRows = response.getDataTable().getNumberOfRows();
for (i = 0; i < numRows; i++) {
var string_coordinates = response.getDataTable().getValue(i, 1);
var split_coordinates = string_coordinates.split(",");
var lat = split_coordinates[0];
var lng = split_coordinates[1];
var coordinate = new google.maps.LatLng(lat, lng);
// Get row data for the info window
var name = response.getDataTable().getValue(i, 0);
createMarker(name);
}
}
function createMarker(name) {
// Create the marker
var marker = new google.maps.Marker({
map: map,
position: coordinate,
icon: new google.maps.MarkerImage("http://www.advocacy.ucla.edu/
Maps/communitybanners/banner-with-url.use-c.png")
});
google.maps.event.addListener(marker, 'click', function(event) {
if (lastWindow) {
lastWindow.close();
} else {
lastWindow = new google.maps.InfoWindow();
}
// Set the position and contents of the info window, and open the
window
lastWindow.setPosition(coordinate);
lastWindow.setContent(name);
lastWindow.open(map);
});
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>
<div id="code"></div>
<script type="text/javascript" src="script/script.js"></script>
</body>
</html>
--
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 google-maps-js-api-v3@googlegroups.com.
To unsubscribe from this group, send email to
google-maps-js-api-v3+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
