レイヤーを追加/削除するリーフレット効果の防止または削除

Question

おはようございます！

リーフレットを使用して360度の視聴者を作成しようとしています。すべて正常に動作しますが、レイヤの追加/削除に移行します。つまり、私はスワッピングに移行したくないということです。私がこれを防ぐために見つけた唯一の方法は、すべてのタイルレイヤーを一緒に追加し、 "bringToFront"と "bringToBack"メソッドで再生することでしたが、別のズームレベルで80タイルレイヤーをロードする必要があり、

私の質問は、地図上に1つのタイルレイヤーだけを残しておき、80レイヤーをすべて追加することなく、このトランジションエフェクトを防止する前/次のレイヤーを追加または削除する方法を知っていますか？

私の作業コードは次のとおりです。あなたの時間とあなたの助けのための

window.onload = init; 

    var map = ""; 
    var oldSrc = ""; 
    var gui = ""; 
    var path = ""; 
    var imgcounter = 1; 
    var extension = "_img/"; 
    var files = new Array(80); 
    var layers = new Array(80); 
    var activate = ""; 

    function init() { 
     oldSrc = './360/TNFF_0PO6055M_001/TNFF_0PO6055M_001-001_img/'; 
     gui = oldSrc.indexOf("-"); 
     path = oldSrc.substr(0, gui + 1); 

     getFiles(); 

     //SLIDER 
     $(function() { 
      $("#slider").slider({ 
       range : "min", 
       value : 1, 
       min : 1, 
       max : 80, 
       slide : function(event, ui) { 

        var photonumber = ui.value; 

        for (var i = 0; i < layers.length; i++) { 
         if (i == photonumber) { 
          layers[i].bringToFront(); 
         } else { 
          layers[i].bringToBack(); 
         } 
        } 

        imgcounter = ui.value; 

       } 
      }); 

     }); 

     //BUTTONS 
     $('.custom_previous').bind('click', function(e) { 
      rotateLeft(); 
     }); 

     $('.custom_play').bind('click', function(e) { 
      play(); 
     }); 

     $('.custom_stop').bind('click', function(e) { 
      stop(); 
     }); 

     $('.custom_next').bind('click', function(e) { 
      rotateRight(); 
     }); 

     //LEAFLET 
     map = L.map('image-map').setView([0, 0], 2); 
     buildLayers(); 
     /* 
     var southWest = map.getBounds().getSouthWest(), 
     northEast = map.getBounds().getNorthEast(), 
     bounds = L.latLngBounds(southWest, northEast); 
     map.setMaxBounds(bounds); 
     */ 
    } 

    //GET FOLDER FILES 
    function getFiles() { 
     oldSrc = './360/TNFF_0PO6055M_001/TNFF_0PO6055M_001-001_img/'; 
     gui = oldSrc.indexOf("-"); 
     path = oldSrc.substr(0, gui + 1); 
     var zero = "0"; 
     var doubleZero = "00"; 

     for (var i = 1; i <= 80; i++) { 
      if (i >= 0 && i <= 9) { 
       files[i - 1] = path + doubleZero + String(i) + extension; 
      } else { 
       files[i - 1] = path + zero + String(i) + extension; 
      } 
     } 
    } 

    //BUILD TILE LAYERS 
    function buildLayers() { 
     for (var i = 0; i < layers.length; i++) { 
      layers[i] = L.tileLayer.zoomify(files[i], { 
       width : 8688, 
       height : 5792, 
       minZoom : 1, 
       maxZoom : 4, 
       attribution : 'LBNV' 
      }).addTo(map); 
     } 
    } 

    //ROTATE LEFT 
    function rotateLeft() { 
     if (imgcounter >= 80) { 
      imgcounter = 1; 
     } else { 
      imgcounter++; 
     } 

     for (var i = 0; i < layers.length; i++) { 
      if (i == imgcounter) { 
       layers[i].bringToFront(); 
      } else { 
       layers[i].bringToBack(); 
      } 
     } 
     $("#slider").slider('value', imgcounter); 
    } 

    //ROTATE RIGHT 
    function rotateRight() { 
     if (imgcounter <= 1) { 
      imgcounter = 80; 
     } else { 
      imgcounter--; 
     } 

     for (var i = 1; i <= 80; i++) { 
      if (i == imgcounter) { 
       layers[i - 1].bringToFront(); 
      } else { 
       layers[i - 1].bringToBack(); 
      } 
     } 
     $("#slider").slider('value', imgcounter); 
    } 

    //PLAY 
    function play() { 
     activate = setInterval(animate, 250); 
    } 

    //PLAY ANIMATION 
    function animate() { 
     if (imgcounter > 80) { 
      imgcounter = 1; 
     } 

     for (var i = 0; i < layers.length; i++) { 
      if (i == imgcounter) { 
       layers[i].bringToFront(); 
      } else { 
       layers[i].bringToBack(); 
      } 
     } 
     imgcounter++; 
     $("#slider").slider('value', imgcounter); 
    } 

    //STOP 
    function stop() { 
     clearInterval(activate); 
    } 

Thaksみんな！

UPDATE：私はこのような何かを探しています：新しいタイルが少し遅れと遷移して表示されますので、http://bibliotecavirtualdefensa.es/BVMDefensa/i18n/consulta/registro.cmd?id=17092

Answer 1

は、彼らがしている場合でも、実際に他の層（複数可）を削除する前に、短いタイムアウトを残しますすでに正しくロードされています。より新しいタイルレイヤーが前のレイヤーの前にロードされている場合をカバーするために、「removeAllLayersExcept」関数を強化する必要があります。さもなければ、前のレイヤーは新しいレイヤーをマップから削除します。しかし、ユーザーが手動でカーソルを逆方向​​にドラッグする場合も、このケースを処理する必要があります。