Эквиваленты значений фильтра KonvaJS
Я пытаюсь найти эквиваленты значений фильтра KonvaJS CSS-фильтров на https://www.cssfilters.co/
Например, как я могу применить фильтр "1977" с KonvaJS. Я перепробовал много вариантов, но каждый раз получаю разные результаты. Также возможно ли дать значения для сепии или оттенков серого?
Я использую фильтры вот так (с разными значениями):
backgroundImage.filters([
Konva.Filters.Contrast,
Konva.Filters.Brighten,
Konva.Filters.HSV
]);
backgroundImage.contrast(10);
backgroundImage.brightness(0.10);
backgroundImage.saturation(7.8);
backgroundImage.hue(0);
backgroundImage.value(0);
1 ответ
Я только что сделал эту комбинацию свойств, и она работает очень близко:
image.filters([
Konva.Filters.Contrast,
Konva.Filters.Brighten,
Konva.Filters.HSV
]);
image.contrast(10);
image.brightness(0.1);
image.saturation(1.1);
image.hue(0);
image.value(0);
const overlay = new Konva.Rect({
width: image.width() * image.scaleX(),
height: image.height() * image.scaleY(),
fill: 'rgba(243, 106, 188, 0.3)',
globalCompositeOperation: 'screen'
});
layer.add(overlay);
layer.draw();
Демонстрация: https://jsbin.com/cuyikeduza/2/edit?html,js,output
Если вам сложно настроить фильтры Konva и имеет смысл написать свой собственный фильтр.