作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想使用 caman js 和 Fabric js 来赋予图像效果。我尝试合并代码,但它给出了两张图像而不是一张。我可以做什么来结合 caman js 和 Fabric js 并解决这个问题?我提到:http://camanjs.com/和 http://fabricjs.com/articles/谢谢。
最佳答案
我认为没有直接的方法可以将 Fabric 和 caman 结合起来。这是我使用过的一种解决方法(只是一个简单的方法。您可以根据自己的意愿增强它):
HTML
<canvas id="canvas" width="600" height="300"></canvas>
Javascript
var canvas = new fabric.Canvas('canvas');
fabric.Image.fromURL('image.png', function(img) {
img.set({
left: 10,
top: 50
});
canvas.add(img).setActiveObject(img);
canvas.renderAll();
var hiddenImg = document.createElement('img');
hiddenImg.src = canvas.getActiveObject().toDataURL();
hiddenImg.id = 'target';
hiddenImg.style.display = 'none';
document.body.appendChild(hiddenImg);
Caman('#target', function(value) {
this.brightness(10);
this.contrast(20);
this.render(function() {
canvas.getActiveObject().setSrc(document.getElementById('target').toDataURL(), function() {
canvas.renderAll();
});
});
});
});
这是 fiddle :http://jsfiddle.net/k7moorthi/dfp1b0mq/
注意:如果要使用外部图像以避免浏览器安全阻止 toDataURL() 方法,请将 crossOrigin 选项设置为 Fabric.Image.fromURL() 方法。例如:
fabric.Image.fromURL('https://s3-eu-west-1.amazonaws.com/kienzle.dev.cors/img/image2.png', function(img) {
...
}, { crossOrigin: 'anonymous' });
关于fabricjs - 我想使用 caman js 和 Fabric JS 在同一 Canvas 上的图像上产生效果。我怎样才能将它们结合起来?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28123799/
使用登录后,我想吐出用户名。 但是,当我尝试单击登录按钮时, 它给了我力量。 我看着logcat,但是什么也没显示。 这种编码是在说。 它将根据我在登录屏幕中输入的名称来烘烤用户名。 不会有任何密码。
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 这个问题似乎是题外话,因为它缺乏足够的信息来诊断问题。 更详细地描述您的问题或include a min
我是一名优秀的程序员,十分优秀!