camanJS - 根據圖像陣列大小堆疊圖層

Question

我正在開發一個網站，用戶可以通過設置搜索條件來執行圖像搜索。然後根據用戶可以選擇或修改的幾個參數顯示圖像，例如位置，大小等。我想提供的一種可能性是將混合模式應用於圖像。經過一些研究和測試後，我選擇了camanJS library來應用這些混合效果。庫作品這樣一種方式，混合模式的只被施加到層，其可以疊加一個在另一個內部，如：

Caman('#test', imgSource, function() { 
    this.newLayer(function() { 
     this.setBlendingMode('multiply'); 
     this.overlayImage(someOtherImgSource); 
     this.newLayer(function() { 
     this.setBlendingMode('softLight'); 
     this.overlayImage(evenOtherImgSource); 
     //and so on... 
     }); 
    }); 
    this.render(); 
}); 

使得混合模式在層施加一個單帆布的內側。我的問題是：如果我有一個圖像數組，我怎麼能堆疊這些函數，一個在另一個內，多少次像我的數組中的圖像？

謝謝！

Answer 1

假設你有3張圖片，你想對每張圖片應用不同的camanjs效果，那麼這很簡單。 var image = [「＃image1」，「＃image2」，「＃image3」];

該數組包含每個圖像的div id。

Caman('#test', imgSource, function() { 
    this.newLayer(function() { 
     this.setBlendingMode('multiply'); 
     this.overlayImage(images[0]); 
     this.newLayer(function() { 
     this.setBlendingMode('softLight'); 
     this.overlayImage(images[1]); 
     //and so on... 
     }); 
    }); 
    this.render(); 
});