SOURCE

let canvas = document.querySelector('canvas');
let context = canvas.getContext('2d');

let x = 0;
let y = 100;

// 画布渲染
function draw() {
    // 清除画布
    // context.clearRect(0, 0, canvas.width, canvas.height)
    // 开始画线
    context.beginPath();
    context.moveTo(x, y);
    x++;
    context.lineTo(x, y);
    context.stroke();
    // 持续渲染
    if (x <= 300) {
        requestAnimationFrame(draw);
    }
};

draw();

<canvas id="canvas" ></canvas>