帆布。 drawImage（）函数。

Question

我有一个下面的脚本，它在我的Windows浏览器中工作。但此代码在Epub电子书（在我的iPad iBooks中）不起作用

<canvas id="e" width="177" height="113"></canvas>
<script>
    var canvas = document.getElementById("e");
    var context = canvas.getContext("2d");
    var myImg = new Image();
    myImg.src = "../Images/box.jpg";
    myImg.onload = function() {
        context.drawImage(myImg, 0, 0); 
    };
</script>

Answer 1

是的，这是正确的。看来iBooks支持很多画布，但不支持drawImage函数。我在一两个月前将它提交给Apple，并且尚未收到关于这是否是错误或预期行为的回复。可能有一些安全原因这不起作用，但考虑到它在移动Safari中的作用，这似乎很奇怪。

Answer 2

首先，向Derrick Schultz提出一个问题。您是如何向Apple提交错误报告的？

嗯，这是我自己的发现。

平台：iPad iBooks。 EPUB。的JavaScript。

帆布。 drawImage（）函数。

不起作用。甚至当页面被“刷新”（或重新分页？通过旋转iPad）时也是如此。这个解决方案是完全禁止的。

以前的解决方案现在似乎是唯一的部分解决方法。

所以，是的。 Canvas和drawImage（）在iPad中不起作用。

首先在屏幕上呈现的隐藏元素

我为所有想通过交互性（Javascript）显示的图像创建了元素。

关键步骤。我确保首先在屏幕上渲染（可见）所有图像。我不得不为此做一个setTimeout（）。

问题：什么是iBooks事件让我知道所有图像都在屏幕上呈现？ windows.onLoad不起作用。对于所有单个图像，即使onLoad也不起作用。

然后我隐藏了（display: none）所有图像，并在用户输入时显示它们。

作品。

唯一的问题是，不能全部适合屏幕的大图片（因为我必须首先显示它们所有）将无效。它们不会在屏幕上呈现。您可以通过启用iBooks上的Scrolling View来验证此理论。当Scrolling View打开时，所有图像（无论多大）都可以在屏幕上呈现。

PS：哇。 Stackoverflow不允许对答案进行评论（寻求澄清）（需要50个声望点）。但它允许我发布答案吗？

iPad Ibooks Javascript Canvas DrawImage不起作用

2 个答案:

帆布。 drawImage（）函数。

首先在屏幕上呈现的隐藏元素