Hi,
I am using some kml layers to display polygons on a map and am referencing
a fusion table to display a pie chart and a scatter chart. I have created
check boxes to toggle the kml layers on the map. I can control the
layering order of the kml layers, but I can't seem to have my fusion points
layer to stay on top of the polygon layers. The polygons cover it up, and
then the points are not clickable. In addition, (and this may coincide
with the display ordering), I'm trying to get my dropdown menu to control
the fusion points displayed on my map. When a user selects a site from the
option menu, I'd either like my fusion point to highlight (or have an info
window pop up) so the point can be found on the map; or I'd like the menu
to only show the site for which the option was selected. I've tried various
snippets of code, but nothing seems to work. The only way I can "sort of"
control the fusion points to go on top was by adding:
onchange="changeMap(this.value) in my select menu. The map loads, but when
a user turns on one of the kml layers, the points fall beneath that layer.
However, when a user clicks a site on the drop down menu, the points will
come back to the top layer.
Again, the desired effect would be to keep the fusion points on the top of
the map, always, and to have the menu operate the display of each site. I
would likely need to add another checkbox for the points so they could ALL
be turned on or off. But, if a user wants to just see one particular point
they would use the drop down menu to find it on the map (the menu currently
operates the stats of the pie and the scatter chart for a particular
site). Here is some code below (with the pie and scatter chart code
removed) and here is my live site:
http://www.esenvironmental.com/projects_multiagency_cl_googlemap_scatterwork2.htm
Thank you in advance!
<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart']});
google.load('maps', '3.9', {other_params: "sensor=false"});
google.setOnLoadCallback(initialize);
var map;
function initialize() {
var myOptions = {
center: new google.maps.LatLng(38.099983, -80.683594),
zoom: 7,
mapTypeControl: true,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE
},
streetViewControl: true,
streetViewControlOptions: {
position: google.maps.ControlPosition.LEFT_TOP
},
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById('map_canvas'),
myOptions);
var layer = new google.maps.FusionTablesLayer();
updateLayerQuery(layer);
layer.setMap(map);
var kmlLayerNationalforestURL =
'http://www.esenvironmental.com/kml/national_forests.kml';
var kmlLayerWildernessURL =
'http://www.esenvironmental.com/kml/wilderness.kml';
var kmlLayerBoundaryURL =
'http://www.esenvironmental.com/kml/study_region.kml';
var kmlOptions = {
preserveViewport: true
};
kmlLayerNationalforest = new
google.maps.KmlLayer(kmlLayerNationalforestURL, kmlOptions);
kmlLayerNationalforest.setMap(null);
kmlLayerWilderness = new google.maps.KmlLayer(kmlLayerWildernessURL,
kmlOptions);
kmlLayerWilderness.setMap(null);
kmlLayerBoundary = new google.maps.KmlLayer(kmlLayerBoundaryURL,
kmlOptions);
kmlLayerBoundary.setMap(map);
document.getElementById('show_hide_KML_Layer_Nationalforest').checked =
false;
document.getElementById('show_hide_KML_Layer_Wilderness').checked = false;
document.getElementById('show_hide_KML_Layer_Boundary').checked = true;
function updateLayerQuery(layer) {
layer.setOptions({
query: {
select: 'Site',
from: '3235688'
}
});
function toggleKMLLayerBoundary() {
if
(!document.getElementById('show_hide_KML_Layer_Boundary').checked)
kmlLayerBoundary.setMap(null);
else
kmlLayerBoundary.setMap(map);
}
function toggleKMLLayerWilderness() {
if
(!document.getElementById('show_hide_KML_Layer_Wilderness').checked)
kmlLayerWilderness.setMap(null);
else
kmlLayerWilderness.setMap(map);
}
function toggleKMLLayerNationalforest() {
if
(!document.getElementById('show_hide_KML_Layer_Nationalforest').checked)
kmlLayerNationalforest.setMap(null);
else
kmlLayerNationalforest.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<!-- Below is the code for the kml layers checkboxes: -->
Show:<input type="checkbox" id="show_hide_KML_Layer_Boundary"
onClick="toggleKMLLayerBoundary();" />Study Area<p>
Show:<input type="checkbox" id="show_hide_KML_Layer_Wilderness"
onClick="toggleKMLLayerWilderness();" />Wilderness<p>
Show:<input type="checkbox" id="show_hide_KML_Layer_Nationalforest"
onClick="toggleKMLLayerNationalforest();" />Forest Service<p>
<!-- Above is the code for the kml layers checkboxes: -->
<option value="Total"></option>
</select>
<label><strong>Site Name:</strong></label>
<select id="Site" style="color: #0000FF"
onchange="changeMap(this.value);"><!-- I need to work on this changeMap
function to be able to display only the point that is selected on the map
-->
<option value="Bear Branch">Bear Branch</option>
<option value="Bearpen Branch">Bearpen Branch</option>
<option value="Bearwallow Run">Bearwallow Run</option>
<option value="Beech Lick Run">Beech Lick Run</option>
<option value="Belfast Creek">Belfast Creek</option>
<option value="Big Hellcat Creek">Big Hellcat Creek</option>
<option value="Big Mack Creek">Big Mack Creek</option>
<option value="Black Run (Lower)">Black Run (Lower)</option>
<option value="Brokenback Run">Brokenback Run</option>
<option value="Buffalo Creek">Buffalo Creek</option>
<option value="Butler Branch">Butler Branch</option>
<option value="Clubhouse Run (Lower)">Clubhouse Run (Lower)</option>
<option value="Clubhouse Run (Upper)">Clubhouse Run (Upper)</option>
<option value="Coal Run (SAMI)">Coal Run (SAMI)</option>
<option value="Coal Run">Coal Run</option>
<option value="Condon Run">Condon Run</option>
<option value="Cove Branch (1)">Cove Branch (1)</option>
<option value="Cove Branch (2)">Cove Branch (2)</option>
<option value="Crawford Run">Crawford Run</option>
<option value="Deep Run">Deep Run</option>
<option value="Elk Run">Elk Run</option>
<option value="Fernow - WS10">Fernow - WS10</option>
<option value="Fernow - WS13">Fernow - WS13</option>
<option value="Fernow - WS4">Fernow - WS4</option>
<option value="Fisher Spring Run">Fisher Spring Run</option>
<option value="Gauley">Gauley</option>
<option value="German River (Upper)">German River (Upper)</option>
<option value="Hateful Run">Hateful Run</option>
<option value="Hazel Run">Hazel Run</option>
<option value="Hedricks Creek">Hedricks Creek</option>
<option value="Hipes Branch">Hipes Branch</option>
<option value="Hogback Branch">Hogback Branch</option>
<option value="Johnson Run">Johnson Run</option>
<option value="Laurel Br of Stony Cr">Laurel Br of Stony Cr</option>
<option value="Laurel Run (4)">Laurel Run (4)</option>
<option value="Laurel Run (5)">Laurel Run (5)</option>
<option value="Laurel Run">Laurel Run</option>
<option value="Left Fork Clover Run">Left Fork Clover Run</option>
<option value="Lewis Fork">Lewis Fork</option>
<option value="Little Cove Creek">Little Cove Creek</option>
<option value="Little Hellgate Creek">Little Hellgate Creek</option>
<option value="Little Mill Creek">Little Mill Creek</option>
<option value="Little Stonecoal Run">Little Stonecoal Run</option>
<option value="Little Stony Cr (L)">Little Stony Cr (L)</option>
<option value="Little Tumbling Creek">Little Tumbling Creek</option>
<option value="Little Walker Cr">Little Walker Cr</option>
<option value="Lost Run">Lost Run</option>
<option value="Mare Run">Mare Run</option>
<option value="Matts Creek">Matts Creek</option>
<option value="Meadow Run">Meadow Run</option>
<option value="Moss Run">Moss Run</option>
<option value="NF Stony Creek">NF Stony Creek</option>
<option value="NNT Glade Creek">NNT Glade Creek</option>
<option value="No Business Creek">No Business Creek</option>
<option value="NoName Trib Gap Cr">NoName Trib Gap Cr</option>
<option value="NoName Trib SF Chry R">NoName Trib SF Chry R</option>
<option value="NoName Trib Stny Cr 1">NoName Trib Stny Cr 1</option>
<option value="Noname Trib Stny Cr 2">Noname Trib Stny Cr 2</option>
<option value="North Fork Cherry (L)">North Fork Cherry (L)</option>
<option value="North Fork Cherry (U)">North Fork Cherry (U)</option>
<option value="North Fork Dry Run">North Fork Dry Run</option>
<option value="North River">North River</option>
<option value="NTN Laurel Run">NTN Laurel Run</option>
<option value="Otter Creek (Upper)">Otter Creek (Upper)</option>
<option value="Otter Creek">Otter Creek</option>
<option value="Paine Run">Paine Run</option>
<option value="Panther Run">Panther Run</option>
<option value="Pine Swamp Branch">Pine Swamp Branch</option>
<option value="Porters Creek">Porters Creek</option>
<option value="Raccoon Branch">Raccoon Branch</option>
<option value="Ragged Run">Ragged Run</option>
<option value="Ramseys Draft">Ramseys Draft</option>
<option value="Red Creek">Red Creek</option>
<option value="Right Fork Clover Run">Right Fork Clover Run</option>
<option value="Roaring Fork (Lower)">Roaring Fork (Lower)</option>
<option value="Roaring Fork (Upper)">Roaring Fork (Upper)</option>
<option value="Rose River">Rose River</option>
<option value="Shawvers Run">Shawvers Run</option>
<option value="St. Marys R (Lower)">St. Marys R (Lower)</option>
<option value="St. Marys R (Middle)">St. Marys R (Middle)</option>
<option value="Staunton River">Staunton River</option>
<option value="Stonecoal Run (R Br)">Stonecoal Run (R Br)</option>
<option value="Sugartree Branch SMR">Sugartree Branch SMR</option>
<option value="Sulphur Spring Creek">Sulphur Spring Creek</option>
<option value="Thunderstruck Creek">Thunderstruck Creek</option>
<option value="Two Mile Run 2">Two Mile Run 2</option>
<option value="Unnamed 1">Unnamed 1</option>
<option value="Unnamed 2">Unnamed 2</option>
<option value="White Oak Canyon R">White Oak Canyon R</option>
<option value="White Oak Fork">White Oak Fork</option>
<option value="White Oak Run">White Oak Run</option>
<option value="Wolf Run">Wolf Run</option>
</select>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-visualization-api/-/1K-fj9KDwcIJ.
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-visualization-api?hl=en.
