私は、ユーザーがマウスを使って描画することができますスクリプトに取り組んでいます: http://jsfiddle.net/ujMGu/私は、描画アプリケーションでマウスの動きが速くて線を壊さないようにするにはどうすればいいですか?
問題:あなたは本当に速いマウスを移動した場合には、いくつかの場所をピクピクしてスキップします。描画線の間に黒いスペースをスキップすることなく、すべての点をキャプチャする方法はありますか?あなたがを追跡する必要があるだろう
CSS
#myid{background: none repeat scroll 0 0 #000000;
color: #FFFFFF;
display: block;
height: 1000px;
margin: 3%;
position: relative;
text-indent: -1100px;}
JS/JQ
$('#myid')
.css('position','relative')
.unbind().die()
.bind('mousemove mouseover',function (e){
var top = parseInt(e.pageY)-$(this).offset().top;
var left= parseInt(e.pageX)-$(this).offset().left;
var pixel= $('<div></div>')
.css({
width:10,height:10,
background: '#fff',
position:'absolute',
top: top, left: left,
'border-radius': 2
});
$(this).append(pixel);
});
HTML
<div id="myid"></div>
おそらく、divでこれを行うのは悪い考えです。代わりにキャンバスを使用することを検討してください。 divは単純なラスターペインティングではなくDOM操作を必要とするため、ほとんどのブラウザーはdivよりもキャンバスが速くなります。 –
(divsをピクセルとして使用する)この方法でのペインティングはかなり制限されています。要件とブラウザのサポートは何ですか?キャンバスではなく、このメソッドを使用する必要がある理由はありますか? –
私はキャンバスにはあまりよく慣れていません。複雑なやり方で、この背後にあるものの上にオーバーレイ/マスクとして他の人にこのメッセージを送ることができます。 – Val