Skip to content

Instantly share code, notes, and snippets.

@gjastrab

gjastrab/fusion_layer_test.html

Created March 11, 2012 19:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gjastrab/2017706 to your computer and use it in GitHub Desktop.
Save gjastrab/2017706 to your computer and use it in GitHub Desktop.
Download ZIP
Google Fusion Layer querying test
Raw
fusion_layer_test.html
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="UTF-8">
<title>Test Fusion Mapping</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function init() {
var numeric_id = 3195033,
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(37.4,-122.1),
zoom: 2,
mapTypeId: google.maps.MapTypeId.SATELLITE
});
var layer = new google.maps.FusionTablesLayer({
query: {
select: 'Latitude,Longitude',
from: numeric_id
},
map: map
});
google.maps.event.addDomListener(
document.getElementById('goFilter'), 'click', function() {
doFilter(layer, numeric_id, map);
}
);
}
google.maps.event.addDomListener(window, 'load', init);
function doFilter(layer, numId, map) {
var inp = document.getElementById('nameInp'),
query = {
select: 'Latitude,Longitude',
from: numId
};
if(inp.value !== '')
query.where = "Name CONTAINS IGNORING CASE '" + inp.value + "'";
console.log("setting where to", query);
if(!layer.getMap()) {
layer.setMap(map);
}
layer.setOptions({query: query});
}
</script>
<style>
#map-canvas { height: 600px; }
</style>
</head>
<body>
<div id="map-canvas"></div>
<div>Name:
<input id="nameInp" type="text" />
</div>
<button id="goFilter">
Filter Data
</button>
<input type="reset" id="reset" value="clear" />
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment