###実現したい事
このサイトを参考にタブレット上にお絵かきソフトを実装したいのですが、曲線が滑らかに描けません。上記のサイトでは滑らかに丸が描けるのですが、私のソースでは丸を描こうとしてもカクカクになってしまいます。実行環境は同じタブレットを用いて試したので、原因はタブレットじゃなくてソースなのかなとは思っています。canvasをタッチしてから動かしている間(touchmoveが呼ばれている間)の座標をコンソール上に出力させてみたのですが、どうにも取得している座標の間隔が大きすぎる気がしました。ちなみにタブレット上ではなく、ブラウザ上に実装して、マウスで丸を描いたときは滑らかに描けました。座標の取得間隔を小さくする(もっと細かく座標を取る)にはどのようにすればよいか分かる方回答お願いします。
###ソース
JavaScript
1var rect = e.target.getBoundingClientRect(); 2x1 = Math.floor(e.touches[0].clientX - rect.left); 3y1 = e.touches[0].clientY - rect.top; 4ctx.strokeStyle = '#000'; 5ctx.lineWidth = 2; 6ctx.lineCap = 'round'; 7ctx.beginPath(); 8ctx.moveTo(x0, y0); 9ctx.lineTo(x1, y1); 10ctx.stroke(); 11ctx.closePath(); 12x0 = x1; 13y0 = y1;
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。