Friday, October 14, 2022

JavaScript - Drawing a Line

 <button onclick="draw()">Draw line</button>
    <canvas height="400" id="canvas" width="500">
    </canvas>
<script>
function draw() {
    const canvas = document.querySelector('#canvas');
    if (!canvas.getContext) {
        return;
    }
    const ctx = canvas.getContext('2d');
    // set line stroke and line width
    ctx.strokeStyle = 'red';
    ctx.lineWidth = 5;
    // draw a red line
    ctx.beginPath();
    ctx.moveTo(100, 100);
    ctx.lineTo(300, 100);
    ctx.stroke();
}
</script>

No comments:

Post a Comment

Basic Comparison of C++ and HTML/JavaScript

 Here’s a basic comparison of C++ and HTML/JavaScript for common programming concepts and  simple code examples for each. This will help ...