0

node/socket.io Pictionary ゲームで遊んでいます。前もってお詫び申し上げます。私はデザイナーであり、js にはあまり熱心ではありません。

キャンバスのサイズを変更しようとしているだけなので、ストロークパスを拡大せずにブラウザウィンドウの幅と高さ全体になりますか? 現在、JavaScript はキャンバスを 500px に設定しています。

関連するコードは次のとおりです。

// ================================================
//                           canvas drawing section
// ================================================

var canvas = $('#canvas'),
    context = canvas[0].getContext('2d');

socket.on('drawCanvas', function(canvasToDraw) {
    if(canvasToDraw) {
        canvas.width(500);
        context.lineJoin = 'round';
        context.lineWidth = 2;

        // ...
    }
});
4

3 に答える 3

0

canvas の clientWidth と clientHeight プロパティを使用する

if (canvas[0].width != canvas[0].clientWidth || canvas[0].height != canvas[0].clientHeight) {
    canvas[0].width = canvas[0].clientWidth;
    canvas[0].height = canvas[0].clientHeight;
}

キャンバスの幅と高さの css を 100% に設定します。

于 2014-05-10T09:06:39.043 に答える
0 
canvas[0].width = $(window).width();
canvas[0].height = $(window).height();

うまくいきました。

于 2013-07-11T01:41:33.047 に答える