Если вести мышь медленно, то промежутков нет, но стоит немного ускорить, появляются очень большие пробелы. Как можно исправить? Или нужен вообще другой подход?
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
canvas.width = 1024;
canvas.height = 678;
canvas.onmousedown = function() {
let flag = true;
draw();
canvas.onmousemove = function() {
if (flag == true) {
draw();
}
}
canvas.onmouseup = function() {
flag = false;
}
canvas.onmouseout = function() {
flag = false;
}
};
function draw() {
let x = event.offsetX;
let y = event.offsetY;
ctx.fillStyle = 'black';
ctx.fillRect(x, y, 5, 5);
}
<style>
canvas {
border: 1px solid;
}
</style>
<canvas id="canvas"></canvas>