Google Maps APIを使用した未定義のJavascript変数

Question

私は、Google Maps Javacript APIを使用してポリラインを描画しています。私はボタンがクリックされたときにポリラインを削除する関数を作成しようとしました。隣にある

<button type="button" class="btn btn-danger" id="clear_button" onclick="removeLine()">Borrar ruta</button> 

とポリラインを描画し、それを除去するためのJavascriptコード：ボタンのHTMLコードは以下の通りである

var map; 
    var flightPath; 
    function initMap() { 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 17, 
      center: {lat: 37.176709, lng: -3.599057}, 
      mapTypeId: 'terrain' 
     }); 

     google.maps.event.addDomListener(document.getElementById('route_button'), 'click', function() { 
      var date_data = document.getElementById('datepicker').value; 
      console.log(date_data); 
      $.ajax({ 
       url:"data_fetcher.php", 
       type:"POST", 
       data: {date_value:date_data},   
       dataType: 'json', 
       success: function(respond){ 
        var flightPlanCoordinates = respond; 
        var flightPath = new google.maps.Polyline({ 
         path: flightPlanCoordinates, 
         geodesic: true, 
         strokeColor: '#FF0000', 
         strokeOpacity: 1.0, 
         strokeWeight: 2 
        }); 
        flightPath.setMap(map);   
        console.log("AJAX level request was successful"); 
       }, 
       error: function(){ 
        console.log("AJAX level request was a failure"); 
       } 
      }); 
     }); 
    } 

    // Eliminar polilinea 
    function removeLine() { 
    flightPath.setMap(null); 
    } 

すべてが正常に動作しますが、私はボタンをクリックすると、

Uncaught TypeError: Cannot read property 'setMap' of undefined at removeLine (device.php:101) at HTMLButtonElement.onclick (device.php:196)

私はグローバルスコープでの飛行経路のVARを宣言したにもかかわらず：ポリラインを削除するには、コンソールには次のようなエラーがスローされます。すべての助けに感謝します。成功機能で

Answer 1

、あなたははに同じ名前のローカル変数を宣言している、JSはが変数を割り当てる際に見つけ最も近い変数を使用します。この問題を解決するには、varを削除するだけです。

success: function (respond) { 
    var flightPlanCoordinates = respond; 
    flightPath = new google.maps.Polyline({ 
     path: flightPlanCoordinates, 
     geodesic: true, 
     strokeColor: '#FF0000', 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
    }); 
    flightPath.setMap(map); 
    console.log("AJAX level request was successful"); 
},