如何从js-dosbox创建的Canvas中获取像素

Question

我已经通过dosbox Div找到了画布，但是一旦我找到了持有画布的节点，我该如何引用它？

获取dbGranChild [0]的上下文只会导致错误..

我正在尝试构建构成dosbox窗口的像素数组，所以想到使用画布获取图像并在框架更改时循环将是一种方式。如果有一个更好的方式比我上面的尝试更乐意将其作为答案。

代码：http://plnkr.co/edit/MC1n9HfwWcqXlAk95XCO?p=preview

console.log(first_place.name)

Answer 1

请参阅w3Schools tutorial。

首先，您需要使用<canvas>代码而不是<div>。

即，替换它：

<div id="dosbox"></div>

有这样的事情：

<canvas id="dosbox" width="200" height="100" style="border:1px solid #000000;">
</canvas>`

其次，替换此代码：

var dosboxId = document.getElementById('dosbox');
dbChild = dosboxId.childNodes;
dbGranChild = dbChild[0].childNodes;
console.log(dbGranChild[0])

有这样的事情：

var c = document.getElementById("dosbox");
var ctx = c.getContext("2d");
ctx.moveTo(0, 0);
ctx.lineTo(200, 100);
ctx.stroke();