Question

我正在尝试创建一个新闻自动收录器，以小方块“像素”呈现文本。我说“像素”因为它们看起来像像素，但显示的实际方块大于1px。

到目前为止，我可以获得从我构建的对象渲染的所有字母，其中包含每个矩形的像素坐标。代码可以在这里看到： https://jsfiddle.net/9u3ez6gu/2/

字母呈现正确，但在我的for循环之后（参见下面的代码示例）我试图在每个字母之间创建一个石灰色的空格。无论我做什么，这个石灰空间都不会被渲染。这是for循环和我用来渲染空间的代码。有谁知道为什么画布不会让我画出石灰色的矩形？

for (i = 0; i <= inv[letter].length; i++) {
    var x = inv[letter][i][1] * full;
    var y = inv[letter][i][0] * full;
    context.beginPath();
    context.rect(x, y, unit, unit);
    context.fillStyle = 'black';
    context.closePath();
    context.fill();
}// End for loop

//Add a gap between letters
var gapx = full * 5;
context.beginPath();
context.rect(gapx, 0, full, full);
context.fillStyle = 'lime';
context.closePath();
context.fill();
}// End function

Answer 1

你的for循环过了一次迭代：

for (i = 0; i <= inv[letter].length; i++) {

应该是<，而不是<=。 让您的开发者控制台保持开放状态！

此外，i应使用var声明，位于函数顶部或for循环标头本身。在这种情况下，它（可能）并不重要，但养成这种习惯是件好事。如果你没有声明变量，那么它将是全局变量。如果你的另一个函数也未能声明另一个i，那么它们将是同一个东西，并且可能导致奇怪的错误。

如果你把

"use strict";

位于<script>块的顶部或每个函数的最顶层，解析器（在现代浏览器中）会将隐式全局变量的赋值标记为错误。

在for function for function中，Canvas不会绘制矩形

1 个答案: