ワイズリマインダー

canvasとfillRectで作成したサイズが300×150になってしまう件

失敗例

var canvas = document.createElement('canvas');
var ctx = canvas.getContext("2d");
ctx.fillStyle = 'rgb(255,0,0)';
ctx.fillRect(0, 0, 300, 400);
img.src = ctx.canvas.toDataURL('image/jpeg');

どうやらcanvasのデフォルトサイズが300×150なのが原因らしい

成功例

var canvas = document.createElement('canvas');
canvas.width = 300;
canvas.height = 400;
var ctx = canvas.getContext("2d");
ctx.fillStyle = 'rgb(255,0,0)';
ctx.fillRect(0, 0, 300, 400);
img.src = ctx.canvas.toDataURL('image/jpeg');

• ≪新しい記事へ
• 古い記事へ≫

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。