html5 canvas做手寫簽名

我用HTML5做了一個手寫簽名，運行在手機瀏覽器上，但是畫出來效果總是很粗糙，曲線不夠平滑，想找大俠指教

HTML>

PhoneGap

瀏覽器不支持canvas

var?canvas=null,context=null;

function?resetCanvas(){

canvas=document.getElementById('simple');

context=canvas.getContext('2d');

}

$(document).ready(function(){

resetCanvas();

canvas.addEventListener('touchstart',function(evt){

evt.preventDefault();

context.beginPath();

context.moveTo(evt.touches[0].pageX,evt.touches[0].pageY);

},false);

canvas.addEventListener('touchmove',function(evt){

context.lineTo(evt.touches[0].pageX,evt.touches[0].pageY);

context.stroke();

},false);

canvas.addEventListener('touchend',function(evt){

},false);

});

------解決方案--------------------

自定義筆刷,使用尺寸較大的圓形.圓形可以讓你的走筆圓潤很多.

如果強大一些,就得一邊存儲軌跡點數據,一邊在后臺使用貝塞爾曲線進行調整,然后將調整后的數據輸出到畫布上.但是雖然看起來更漂亮,畢竟和手寫真跡不太一樣.但換個角度看,既然原筆跡不同,那么根據原筆跡利用同樣規則調整過的字跡一般也不太相同的.

------解決方案--------------------

牛人。。。頂了。。。。

------解決方案--------------------

你要查看下?平滑繪制線段?的內容

在你的線段的?實際像素點的?邊緣?要增加邊界色像素點?這樣視覺可以有平滑的感覺

具體算法你要搜索下?應該不難??就是?麻煩點

總結

以上是生活随笔為你收集整理的微信 html5 识别手写签名,html5 canvas做手写签名,该如何解决的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。