Question

当我将鼠标悬停在锚标签上时，我想突出显示折线。这是我的代码，Polyline是从gps文件中提取的，这个文件都运行正常，但我似乎无法从外部函数'setOptions'

<script>

    $.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
         });    

     }  


</script>

<a onmouseover="hoverTrack()">HIGHLIGHT</a>

Answer 1

您将polyTrack声明为ajax函数的回调部分中的局部变量。

有几种方法可以解决这个问题。一个简单的方法是在ajax调用之前声明折线，然后更新其路径并在ajax回调上显示它。这样，变量可用于ajax部分和hoverTrack函数。

    var polyTrack = new google.maps.Polyline({
          strokeOpacity: 0.5,
          strokeWeight: 5
        });

    $.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);
        });

        polyTrack.setPath(points);
        polyTrack.setMap(map);              

      }
    }); 

    // WHEN I HOVER THE DIV
    function hoverTrack(){
         polyTrack.setOptions({
             strokeOpacity: 1,
             strokeWeight: 10
         });    
     }

@ Dr.Molle答案也应该有效。注意map变量的可用性。大多数谷歌地图示例将地图范围包装在初始化函数中。

Answer 2

删除

中的var-keyword

var polyTrack =

否则该变量将无法全局访问

从外部功能突出显示谷歌地图V3 Polyline

2 个答案: