Как добавить несколько фильтров (Caman.js)? - PullRequest
Новая
       18

Как добавить несколько фильтров (Caman.js)?

0 голосов
/ 16 января 2019

Я недавно работаю с алгоритмами обнаружения лиц, и я хочу добавить несколько фильтров на холст во время работы алгоритмов обнаружения. Как вы видите на рисунке 1, я создал модал, который работает либо с образцами, либо с пользовательскими фильтрами (Библиотека Caman.js)

MODAL : Filters

Когда выбор сделан, я хочу добавить фильтры на холсте или отменить фильтры. Есть 2 варианта:

1) КНОПКА ПОДТВЕРЖДЕНИЯ: 

/* PREPARE ARRAYS */
//SAMPLE FILTERS (vintage = true sunrise = true)
var array1 = [vintage, sunrise, .../* selected values*/ ]; 

//CUSTOM FILTERS (vintage = 0.4, sunrise = 0.8) 
var array2 = [0.4,0.8, .../* selected values*/ ];

2) КНОПКА ОТМЕНЫ: 

/* RESETS ARRAYS */
array1.length = 0;
array2.length = 0;

Пока я пытался работать с элементом изображения, который прекрасно работает, но только проверяя все элементы по отдельности. Чем больше фильтров добавлено - тем больше должно быть операторов if / else-if: 

if(array1.contains("vintage")){
   Caman('#myIcon', function(){
      this.vintage().render(); /*.vintage & anyFilter is in Caman.js API */
   });
}else if(array1.contains("sunrise")){
  //.....etc
}

Мой вопрос:

Есть ли способы, которыми я могу передать строковое значение в определенной библиотеке (Caman.js), поскольку все фильтры являются функциями в библиотеке и что-то .render (), очевидно, не будет работать?

Например: 

function apply_Filters (*MY_FILTER_DATA*) {
    Caman('#myIcon', function(){
        this.*MY_FILTER_DATA*.render();
}

1 Ответ

0 голосов
/ 24 января 2019

Этот учебник помог мне найти решение.

Решение:

  • Сначала добавьте выбранные фильтры в список массивов: 

    myFiltersList = [ "vintage", "filter331" ];

  • Для каждого элемента вы должны создать функцию Caman и проверить, содержится ли каждый фильтр списка (текстовое значение) в библиотеке Caman.js (имя функции). Я использовал: 

    if( array[i]   in this) statement

  • Это проверило бы текстовое значение фильтра, если оно содержало в этом , который в данном случае является Caman.js. Будьте осторожны, что .this вы должны использовать, чтобы сделать эту работу. 

    if(filtersList[i] in this) //in this  = in Caman.js

  • После проверки, существует ли фильтр, фильтр должен быть подготовлен вначале с использованием специального синтаксического метода: 

    this[ filtersList[i] ] (); //or this["vintage"](); or this.vintage();

  • Не забудьте отобразить (): 

    this.render();

Полный пример: 

//For each filter in the list
myFiltersList.forEach( function() {

    //Open Caman Function and Reference the 2D canvas
    Caman('#myCanvas', function () {

        //Check if the current filter is declared within the library Caman.js
        if(myFiltersList[i] in this){

            alert("filter in the list");

            //Add filter from this as filter in Caman function/
            this[myFiltersList[i]]().render();

            i++; //Increase counter
        }else{
            alert("filter not in the list");
        }
    });
});

Результаты:

Чехол "винтаж": 

alert("filter in the list");
this[myFiltersList[i]]().render();
i++;

Корпус "filter331": 

alert("filter not in the list");
...