顯示不正確，請問哪里有問題？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script type="text/javascript" src="digit.js"></script>
<title>Document</title>
</head>
<body>
<canvas id="box"> 你的瀏覽器不支持canvas,請升級你的瀏覽器</canvas>
<script>
var WINDOW_WIDTH = 1024;
var WINDOW_HEIGHT = 768;
var RADIUS = 8;
var MARGIN_LEFT=60;
var MARGIN_TOP=30;
window.onload = function () {
var canvas = document.getElementById('box');
var context = canvas.getContext('2d');
canvas.width = WINDOW_WIDTH;
canvas.height = WINDOW_HEIGHT;
render(context);
}
//繪制畫布
function render(cxt) {
var hours = 12;
var minutes = 34;
var seconds = 56;
//從什么位置開始（0.0），獲取十位數字（parseInt(hours/10)）cxt：上下文繪圖環境
renderDigit(MARGIN_LEFT,MARGIN_TOP, parseInt(hours / 10), cxt);
renderDigit(MARGIN_LEFT+15*(RADIUS + 1),MARGIN_TOP, parseInt(hours % 10), cxt);
renderDigit(MARGIN_LEFT+30*(RADIUS + 1),MARGIN_TOP, 10, cxt);
renderDigit(MARGIN_LEFT+39*(RADIUS + 1),MARGIN_TOP, parseInt(minutes / 10), cxt);
renderDigit(MARGIN_LEFT+54*(RADIUS + 1),MARGIN_TOP, parseInt(minutes % 10), cxt);
renderDigit(MARGIN_LEFT+69*(RADIUS + 1),MARGIN_TOP, 10, cxt);
renderDigit(MARGIN_LEFT+78*(RADIUS + 1),MARGIN_TOP, parseInt(seconds / 10), cxt);
renderDigit(MARGIN_LEFT+93*(RADIUS + 1),MARGIN_TOP, parseInt(seconds % 10), cxt);
}
function renderDigit(x, y, num, cxt) {
cxt.fillStyle = 'rgb(0,102,153)';
for (var i = 0; i < digit[num].length; i++)
for (var j = 0; j < digit[num][i].length; j++)
//如果二維數組數字為1，就在1的地方繪制一個小圓
if (digit[num][i][j] == 1) {
cxt.beginPath();
cxt.arc(x + j * 2*(RADIUS + 1) + (RADIUS + 1), y + j * 2*(RADIUS + 1) + (RADIUS + 1), RADIUS, 0, 2 * Math.PI);
cxt.closePath();
cxt.fill();
}
}
</script>
</body>
</html>
2019-05-08
cxt.arc(x + j * 2*(RADIUS + 1) + (RADIUS + 1), y + i * 2*(RADIUS + 1) + (RADIUS + 1), RADIUS, 0, 2 * Math.PI);
你把y + i * 2*(RADIUS + 1) 里面的i寫成j是錯的，糾正一下，把這里的j改成i