Pixastic对我不起作用，为什么？ [英] Pixastic doesn't work properly for me, why?

问题描述

我需要在网页上进行一些交互式图像处理。我找到了 pixastic ，这对这份工作来说似乎不错。

I need to do some interactive image processing on a webpage. I found pixastic and it seemed good for the job.

在此页面上，我正在尝试模糊图像，但我工作只能模糊。 模糊对我不起作用。

On this page I'm trying do blur an image, but I can only get "blurfast" to work. "blur" doesn't work for me.

我一直在环顾四周并阅读文档而无法理解为什么会失败。有没有人知道？

I've been looking around and reading the documentation and can't see why it fails. Has anyone any idea?

我用这个js：

$(function(){
    var img = document.getElementById("imageone");

    $("#blurfastbutton").click(function() {
        Pixastic.process(img, "blurfast", {amount:0.2});
    });

    $("#blurbutton").click(function() {
        Pixastic.process(img, "blur");
    });
});

推荐答案

对于许多操作，Pixastic必须交换< img> 带有< canvas> 元素的元素，并执行逐像素调整。使用blur操作图像时会抛出安全性异常，因为图像源位于文档的不同域上。

For many manipulations, Pixastic has to swap the <img> element with a <canvas> element and perform per-pixel adjustments. A security exception is being thrown when the image is being manipulated using "blur", because the image source resides on different domain to the document.

您还应该知道，由于canvas元素中的安​​全限制，Pixastic仅适用于与您正在使用它的页面位于同一主机上的图像上。 [来源]

blurfast不会发生这种情况的原因是因为它的工作方式不同：一次又一次地调整图像的大小。显然，这并没有违反 < canvas> 元素的安全政策。

The reason this doesn't happen with "blurfast" is because it works differently: resizing the image over and over again by very small amounts. This, apparently, doesn't violate the security policies of the <canvas> element.

最好的方法是坚持blurfast—毕竟，它更快，更有活力。如果你真的想使用模糊那么你必须确保所有图像与当前文档在同一个域中。

The best approach is to stick to "blurfast" — it is faster and more dynamic, after all. If you really want to use "blur" then you'll have to ensure that all images are on the same domain as the current document.

这篇关于Pixastic对我不起作用，为什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！