天天看點

html5無法繪制線條,Html5畫布 - 使用fabric.js繪制完美線條或不使用

我正在建立一個遊戲,我需要在不同類型的螢幕分辨率和縮放下實作HTML5上的完美畫布線。Html5畫布 - 使用fabric.js繪制完美線條或不使用

很容易了解我說的,簡單地粘貼在兩個不同的代碼轉換成HTML檔案(沒有的jsfiddle,因為它太小通知):

随着fabric.js:

var context=c.getContext("2d");

new fabric.Canvas('c', { selection: false });

context.moveTo(0, 0);

context.lineTo(0, 300);

context.stroke();

沒有fabric.js:

var context=c.getContext("2d");

context.moveTo(0, 0);

context.lineTo(0, 300);

context.stroke();

現在你可以看到,fabric.js删除您不同種類的浏覽器縮放(滑鼠滾輪)一旦頁面加載下得到的模糊。 我有兩個問題,它雖然:

1)一旦你點選畫布上線了 2)這是一個大的架構/庫,而我隻需要它來畫線(也許不是它是否能夠實作與PNG圖像一樣)

那麼,有沒有一種方法可以在不使用fabric.js的情況下使用簡潔的JavaScript代碼實作相同的清晰度結果? 如果不是,我該如何解決點選問題?

謝謝。