2017-01-27 21 views
1

クリックイベントでポリラインを再作成する機能があります。それは動作しますが、リフレッシュレイヤーは以前のポリラインをまだ持っています。以前のポリラインが消えたときにマップをズームするときだけです。リーフレット前のポリラインを削除

マイコード。私は新しいポリラインが作成される前に、まずそれをクリアするためにclear_polylineを配置する必要があります

function buildHotline(response) { 
    //clearMap(); 
    //clear_polyline(); 
    document.getElementById('mapid').innerHTML = "<div id='map' style='width: 100%; height: 100%;'></div>"; 
    //document.getElementById('map').innerHTML = "<div id='mapid' style='width: 100%; height: 100%;'></div>"; 
    var tiles = L.tileLayer('http://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png', { 
    attribution: 'Tiles courtesy of <a href="http://openstreetmap.se/" target="_blank">OpenStreetMap Sweden</a> &mdash; Map data &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'}); 


    var map = new L.map('map', { 
     layers: [tiles], 
     scrollWheelZoom: true, 
     dragging: true, 
     tap: false 
    }); 


    var hotlineLayer = L.hotline(response, { 
     min: 0, 
     max: 120, 
     palette: { 
      0.0: '#3ebcef', 
      0.5: '#78b3d3', 
      1.0: '#000203' 
     }, 
     weight: 5, 
     outlineColor: '#000203', 
     outlineWidth: 1 
    }); 



    //clear first 
    clear_polyline(); 

    bounds = hotlineLayer.getBounds(); 
    map.fitBounds(bounds); 



    hotlineLayer.addTo(map); 


    function clear_polyline() { 
     try { 
      // statements 
      setTimeout(function(){ map.invalidateSize()}, 400); 
      //alert("erase line"); 
      map.removeLayer(hotlineLayer); 

     } catch(e) { 
      // statements 
      console.log(e); 
     } 

    } 

} 

。その機能のいくつかのランがhotlineLayerの同じインスタンスを参照することができるように感謝

答えて

0

は、buildHotline()関数のhotlineLayer外部スコープへの参照を置きます。

次に、定義されていないかどうかを確認し、定義されていない場合は削除し、新しく作成されたインスタンスで再割り当てします。解決策はかなり似ているよう

すなわち:

var thing; 

function refreshThing() { 
    if (thing) { remove(thing); } 
    thing = newThing(); 
} 

は、How to remove L.rectangle(boxes[i])も参照してください。

関連する問題