问题描述:

I feel like I'm getting close but missing something here. My source (polygon) data is in fusion tables, and I would like to create a 2 tab info window and call data from the table into it. Seen a bunch of examples (see: https://fusion-tables-users-group.googlegroups.com/attach/ec0975e69edcfb96/infowindow_tabs_5.html?pli=1&view=1&part=4 for one), so I have hope this is doable...

My code (from the initialize function) is below. Right now, I am trying specifically to query the values (using e.row) from the field 'ROOF_TOTAL' to put into tab 1 (for initial testing purposes).

 function initialize() {

// set the geocoder variable equal to the instance of the google maps geocoder object

geocoder = new google.maps.Geocoder();

//declare variables for map set up

map = new google.maps.Map (document.getElementById('hatfield_map'), {

center: new google.maps.LatLng(42.37098, -72.59818),

zoom: 17,

mapTypeId: google.maps.MapTypeId.ROADMAP

});

// Set up a styles array to fill in color for the different polygon types based on the query

// of the value 'TYPE' in the FusionTable...

var layer = new google.maps.FusionTablesLayer({

query:{

select: 'geometry',

from: 'TABLE-ID'

},

// suppressInfoWindows: true

// Set up the stroke color and opacity of all polygons...

styles: [{

polygonOptions: {

strokeColor: '#00ffff',

strokeOpacity: .4,

strokeWeight: .5

}]

suppressInfoWindows: true

});

var infowindow = new google.maps.InfoWindow({

});

// create a custom infowindow, Add a click listener that creates a new infowindow

google.maps.event.addListener(layer, "click", function(e) {

'<ul style="font-size:12px;">' +

'<li><a href="#tab-1"><span>Potential Power Capacity</span>

</a></li>' +

'<li><a href="#tab-2"><span>Two</span></a></li>' +

'</ul>' +

'<div id="tab-1">' +

'<p>' + e.row['TOTAL_ROOF'].value + " "+ '</p>' +

'</div>';

infowindow.setContent(contentString);

infowindow.setPosition(e.latLng);

//Infowindow-opening event handler

infowindow.open(map);

$(".tabs").tabs();

});

layer.setMap(map);

}

相关阅读:
Top