HTML5 Canvas上下文globalAlpha无法处理图像[iOS]

时间:2015-02-16 23:00:03

标签: javascript ios canvas html5-canvas

我正在更新“this.opacity”值以淡化svg徽标。除了iOS(8)之外,代码正在工作。

    var size = (this.canvas.width * 0.2) * 0.4;

    this.context.save();
    this.context.globalAlpha = this.opacity;
    this.context.drawImage(this.svg, this.canvas.width * 0.04, this.canvas.width * 0.027, size, size);
    this.context.restore();

1 个答案:

答案 0 :(得分:0)

iOS上支持的SVG图像的动画。但我找到了解决方案。如果使用以下代码创建全屏画布以缩放它:

var ratio = window.devicePixelRatio || 1,
    width = $(window).width(),
    height = $(window).height();

this.canvas.width = width * ratio;
this.canvas.height = height * ratio;
this.canvas.style.width = width + "px";
this.canvas.style.height = height + "px";

this.update();

您将能够使用双倍大小的图像来提供视网膜支持,这样您就不必在画布中使用SVG元素(这对您的记忆来说也很糟糕)。好的是图像将接受设置上下文的globalAlpha。

希望读者充分了解情况: - )。