Skip to content

Instantly share code, notes, and snippets.

@tmsanchez

tmsanchez/Drawtext.html

Created November 20, 2020 20:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tmsanchez/06c36b6c6c5139236da580642876d24d to your computer and use it in GitHub Desktop.
Save tmsanchez/06c36b6c6c5139236da580642876d24d to your computer and use it in GitHub Desktop.
Download ZIP
Draw a text in random coordinates on a Canvas
Raw
Drawtext.html
<!DOCTYPE html>
<html>
<head>
<script>
function drawWords() {
const ctx = document.getElementById('drawArea').getContext('2d');
ctx.font = '12px serif';
const x = Math.floor(Math.random() * 300);
const y = Math.floor(Math.random() * 300);
ctx.fillText('Some Text', x, y);
}
</script>
</head>
<body>
<h2>Drawing words in a canvas</h2>
<p id="demo">Presss button to draw a text.</p>
<button type="button" onclick="drawWords()">Dibuja</button>
<canvas id="drawArea" width="300" height="300">
</canvas>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment