创建动态JavaScript对象
问题描述:
我正在使用Fabric.js
。对于图像,我想为用户提供image filter
选项。下面创建动态JavaScript对象
是用于创建新过滤Gayscale的代码:
var filter = new fabric.Image.filters.Grayscale();
canvas.getActiveObject().filters=[];
canvas.getActiveObject().applyFilters(_canvasObject.renderAll.bind(_canvasObject));
canvas.getActiveObject().filters.push(filter);
canvas.getActiveObject().applyFilters(_canvasObject.renderAll.bind(_canvasObject));
对于其它过滤器也代码几乎是相同的,其是除了第一行重复。
我提供了用于选择过滤器的复选框。我遍历所有checkBoxes
并添加event listener
以应用新的过滤器。所以在下面的代码中,我想动态创建过滤器对象。
var filterClickHandler = function(selectedFilter){
return function(){
applySelectedFilter(selectedFilter);
}
}
function applySelectedFilter(selectedFilter){
//selectedFilter may be Grayscale,Sepia,etc...
// var filter = new fabric.Image.filters.Grayscale();
var filter = new fabric.Image.filters.selectedFilter();
}
无论如何这样做?
答
fabricJS类仍然是普通对象。 你可以做一些简单的事情:
function applySelectedFilter(selectedFilter){
var filter = new fabric.Image.filters[selectedFilter]();
}
你能为它提供一个小提琴吗? –