I have this javascript which I am working on but the map in the HTML is just not displaying. I have a similar fusion table with layer_1 which is displaying fine but when I put layer-2 instead of layer_1 and pull up a different tableid with same code. The map does not show up.
var tableid_2 = 431xxxx;
var layer_2;
var queryUrlHead = 'http://www.google.com/fusiontables/api/query?sql=';
var queryUrlTail = '&jsonCallback=?';
var zoom = 7;
var latlng = new google.maps.LatLng(3x.7996, -11x.1668);
function initialize() {
var myOptions = {
zoom : zoom,
center : latlng,
mapTypeId : google.maps.MapTypeId.TERRAIN,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
position: google.maps.ControlPosition.TOP_LEFT
},
scaleControl: true,
scaleControlOptions: {
position: google.maps.ControlPosition.BOTTOM_LEFT
},
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
layer_2 = new google.maps.FusionTablesLayer(tableid_2);
var qry = "SELECT 'Location2', 'Name2','URL' FROM " + tableid_2;
layer_2.setMap(map);
layer_2.enableMapTips({
select: "'Name2'",
from: tableid_2,
geometryColumn: 'Location2',
suppressMapTips: false,
delay: 50,
tolerance: 5
});
addListeners();
layer_2.setQuery(qry);
var col_list = 'Name2';
if(order_list && order_list !== 'Name2') {
query += " ORDER BY " + order_list;
}
var queryurl = encodeURI(queryUrlHead + qry + queryUrlTail);
$.ajax({
type : "GET",
url : queryurl,
dataType : "jsonp",
success : dataHandlerCallback,
error : function() {
alert("AJAX ERROR for " + queryurl);
}
});
new google.maps.LatLng(3x.7996, -11x.1668);
?