canvas js documentation code example

Example 1: canvas nodejs

const { createCanvas, loadImage } = require('canvas')const canvas = createCanvas(200, 200)const ctx = canvas.getContext('2d') // Write "Awesome!"ctx.font = '30px Impact'ctx.rotate(0.1)ctx.fillText('Awesome!', 50, 100) // Draw line under textvar text = ctx.measureText('Awesome!')ctx.strokeStyle = 'rgba(0,0,0,0.5)'ctx.beginPath()ctx.lineTo(50, 102)ctx.lineTo(50 + text.width, 102)ctx.stroke() // Draw cat with lime helmetloadImage('examples/images/lime-cat.jpg').then((image) => {  ctx.drawImage(image, 50, 0, 70, 70)   console.log('<img src="' + canvas.toDataURL() + '" />')})

Example 2: canvas in javascript

<!DOCTYPE HTML>

<html>
   <head>
   
      <style>
         #mycanvas{border:1px solid red;}
      </style>
   </head>
   
   <body>
      <canvas id = "mycanvas" width = "100" height = "100"></canvas>
   </body>
</html>

Tags:

Javascript Example

Recent Posts