如何通过 Haxe 放大从 ImageData 绘制到画布？答案

【问题标题】：How can I draw from ImageData to canvas with zoom in Haxe?如何通过 Haxe 放大从 ImageData 绘制到画布？
【发布时间】：2018-08-06 12:41:29
【问题描述】：

好吧，我将 ScreenBuffer:ImageData 填充为 480x360，然后想将其绘制到 960x720 的画布上。任务是降低填充率；现在的像素非常小，我们可以通过一些质量损失将它们放大。我寻找具有 2D 加速的运算符。但是我们不能直接写信给js.html.Image，而ImageData 没有链接到js.html.Image。我找到了一个纯 JS 的例子：

https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas

但是，它不想在 Haxe 中工作，因为没有“缩放”元素。还有一些关于从一个图像复制到另一个图像时 HTML 限制的信息。非常感谢您的回答！

【问题讨论】：

"它不想在 Haxe 中工作，因为没有 'zoom' 元素。" - 不太清楚你的意思，你能详细说明一下吗？
这里是字符串“var zoomctx = js.Browser.document.getElementById('zoom').getContext('2d');”编译器写“js.html.Element has no field getContext”

标签： javascript haxe

【解决方案1】：

编译器写“js.html.Element has no field getContext”

getElementById() 的返回类型是通用的js.html.Element 类。因为在你的情况下，你知道你正在处理一个<canvas>，你可以安全地将它转换为the more specific CanvasElement。然后，您可以调用它的getContext() method：

var canvas:CanvasElement = cast js.Browser.document.getElementById('zoom');
var zoomctx = canvas.getContext('2d');

【讨论】：

我试过你的代码。编译器写道：Type not found : CanvasElement。下一个版本可以编译并运行，但 canvas1 的值为 null：var canvas1 = cast js.Browser.document.getElementById('zoom'); if (canvas1 != null) {var zoomctx = canvas1.getContext('2d');}
您需要先导入CanvasElement (js.html.CanvasElement)。但是，这不应该导致它成为null。你确定你的 HTML 是正确的吗？
我已经添加了import js.html.CanvasElement; 并且字符串var canvas1:CanvasElement = cast js.Browser.document.getElementById('zoom'); 编译但canvas1 等于null。关于 HTML：是的，我很确定
这段代码编译并运行没有错误。谢谢！