在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML5  HTML/ 在用canvas繪制五子棋棋盤(pán)時(shí)候遇到的問(wèn)題

在用canvas繪制五子棋棋盤(pán)時(shí)候遇到的問(wèn)題

我想用canvas繪制一個(gè)五子棋棋盤(pán)，但是遇到一個(gè)很奇怪的問(wèn)題。代碼如下

<canvas id="chessboard" class="chessboard"></canvas>
<script>
    Gobang.prototype.drawChessboard = function() {
        var chessboardCanvas = document.getElementById("chessboard");
        var chessboardCtx = chessboardCanvas.getContext('2d');
        for(var i = 0; i < 15; i++){
            chessboardCtx.moveTo(15 + i * 30 , 15);
            chessboardCtx.lineTo(15 + i * 30 , 435);
            chessboardCtx.stroke();
            chessboardCtx.moveTo(15 , 15 + i * 30);
            chessboardCtx.lineTo(435 , 15 + i * 30);
            chessboardCtx.stroke();
        }
    };
    var gobang = new Gobang();
    gobang.drawChessboard();
</script>

結(jié)果繪制的棋盤(pán)是這樣的：
圖片描述

這是為什么呢？

回答
編輯回答
凹凸曼

要在html的canvas里設(shè)置好寬高。

2017年7月3日 02:32