Hello Everyone,

I have my map up and running finally but have one more thing to figure out.
I am using the latest release of the API and call live XML data via the
following:

  Hazmat.setMap(map);
  var RichmondTraffic = new
google.maps.KmlLayer('http://map.richmondgov.com/Bing/Traffic/georssfeed.ashx'
<http://map.richmondgov.com/Bing/Traffic/georssfeed.ashx%27>);

  RichmondTraffic.setMap(map);
  var StateShelters = new
google.maps.KmlLayer('https://cop.vdem.virginia.gov/gis_feeds/ShelterGeoRSS.ashx'
<https://cop.vdem.virginia.gov/gis_feeds/ShelterGeoRSS.ashx%27>);

  StateShelters.setMap(map);
  var trafficLayer = new google.maps.TrafficLayer();
  trafficLayer.setMap(map);


What I am trying to do now is create buttons to toggle each individual
feed on and off.  I have seen many examples doing this via toggling
the overlay....here's an example link:
http://code.google.com/apis/maps/documentation/v3/examples/overlay-hideshow.html
but cannot  seem to get my page to do this.  I'm not a programmer but
am trying my hardest to get this done.


I've tried looking at examples but this is a bit over my head and I'm
really at a standstill.  Would someone be willing to look at my code
and help me get started?  Here is the link to my map
(http://www.gamecarver.com/viperapp.html) and below is the html.  I'm
sure it's relatively simple, and once I see how the code works in my
case I can replicate it out no problem.


Thank you so much for taking the time to read my newbie post.

Jack

<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>VIPER Traffic and Hazmat LIVE</title>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true";></script>

<script type="text/javascript">
var initialLocation;
var statepolice = new google.maps.LatLng(37.502168, -77.542212);


function initialize() {
  var myOptions = {
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);

  var Hazmat = new
google.maps.KmlLayer('https://cop.vdem.virginia.gov/gis_feeds/GeoRSS2.ashx'
<https://cop.vdem.virginia.gov/gis_feeds/GeoRSS2.ashx%27>);
  Hazmat.setMap(map);
  var RichmondTraffic = new
google.maps.KmlLayer('http://map.richmondgov.com/Bing/Traffic/georssfeed.ashx'
<http://map.richmondgov.com/Bing/Traffic/georssfeed.ashx%27>);

  RichmondTraffic.setMap(map);
  var StateShelters = new
google.maps.KmlLayer('https://cop.vdem.virginia.gov/gis_feeds/ShelterGeoRSS.ashx'
<https://cop.vdem.virginia.gov/gis_feeds/ShelterGeoRSS.ashx%27>);

  StateShelters.setMap(map);
  var trafficLayer = new google.maps.TrafficLayer();
  trafficLayer.setMap(map);
  // Safari supports the W3C Geolocation method
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {

      initialLocation = new
google.maps.LatLng(position.coords.latitude,position.coords.longitude);
      var placeMarker = new google.maps.Marker({
        position: initialLocation,
        map: map,
      });

      map.setCenter(initialLocation);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation();
  }


  function handleNoGeolocation() {
    initialLocation = statepolice;
    map.setCenter(initialLocation);
  }
}
</script>
<style>

DIV.container {
    width: 100%;
    height: 50px;
        align: center;
        background-image:
url(http://www.gamecarver.com/img/appimages/DivHeaderBG2.png);

        // display: table-cell;
        vertical-align: middle;
    font-size:medium;
        font-family: sans-serif;
        color: white;
        text-align: center;
        font-weight: bold;
        }
</style>

</head>
<body style="margin:0px; padding:0px;" onload="initialize()">

  <div style="width:100%; height:385px">
  <div class="container" ><img
src="http://www.gamecarver.com/img/appimages/Header1.png";</div>

  <div id="map_canvas" style="width:100%; height:100%"></div>

  <div style="background-image:
url(http://www.gamecarver.com/img/appimages/DivHeaderBG2.png); height:
25px; width: 100%"></div>

  </div>
</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 [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-maps-js-api-v3?hl=en.

Reply via email to