【问题标题】：Using FabricJS like -webkit-filter使用像 -webkit-filter 这样的 FabricJS
【发布时间】：2014-10-30 06:34:25
【问题描述】：
我在网上找不到真正的答案，所以我开始了：我想使用 FabricJS 作为 -webkit-filter 的替代品，因为我有一个过滤器链，我喜欢在 div 的背景图像上使用它在我的网页上。我现在的问题是：如何使用 FabricJS 实现这一目标？背景图像由 CSS 规则 background-image: url(/path/to/img) 在 div 上设置，我只想在图像呈现为 div 的背景之前将一些 FabricJS 图像过滤器应用于图像。这可能吗？如果是，我将如何处理？
【问题讨论】：
标签：
javascript
jquery
css
fabricjs
【解决方案1】：
好吧，我会使用 Fabric 和 JQuery 执行以下操作：
- 创建具有图像宽度和高度的织物画布元素。
- 将原始图像插入画布。
- 对图像应用滤镜。
- 声明一个变量
var image_with_filters;
- 使用
image_with_filters = canvas.toDataURL('image/jpeg', 0.8);（或某些图像格式和参数）将画布内容分配给此变量。
- 将此变量应用于 div 背景
$('#your_div').css('backgroundImage','url('+image_with_filters+')');
- 试试看。
问候。