title: Highlight Google maps V3 Polyline from external function
body: <p>I'm wanting to highlight a Polyline when I hover on an anchor tag. Here's my code, the Polyline is being drawn from a gps file which is all working fine but I can't seem to 'setOptions' from an external function</p>
  
  <pre><code>&lt;script&gt;
  
      $.ajax({
        type: "GET",
        url: "myTrack.gpx",
        dataType: "xml",
        success: function(xml) {
          var points = [];
          var bounds = new google.maps.LatLngBounds ();
          $(xml).find("trkpt").each(function() {
            var lat = $(this).attr("lat");
            var lon = $(this).attr("lon");
            var p = new google.maps.LatLng(lat, lon);
            points.push(p);
            bounds.extend(p);
          });
  
          var polyTrack = new google.maps.Polyline({
            // use your own style here
            path: points,                 
            strokeOpacity: 0.5,
            strokeWeight: 5
          });
  
          polyTrack.setMap(map);              
  
        }
      }); 
  
      // WHEN I HOVER THE DIV
      function hoverTrack(){
  
           polyTrack.setOptions({
               strokeOpacity: 1,
               strokeWeight: 10
           });    
  
       }  
  
  
  &lt;/script&gt;
  
  &lt;a onmouseover="hoverTrack()"&gt;HIGHLIGHT&lt;/a&gt;
  </code></pre>