Created
October 10, 2015 13:56
-
-
Save suissa/3a4f69cb2d9e90a11978 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <title>Canvas API</title> | |
| </head> | |
| <body> | |
| <canvas id="x" width="300" height="300"></canvas> | |
| <button onclick="desenhar()">desenhar</button> | |
| <script> | |
| function desenhar(){ | |
| // Obtemos o contexto | |
| context=document.getElementById('x').getContext('2d') | |
| //Iniciamos um novo desenho | |
| context.beginPath() | |
| //Movemos a caneta para o inicio do desenho | |
| context.moveTo(150,50) | |
| //Desenhamos as linhas | |
| context.lineTo(220,250) | |
| context.lineTo(50,125) | |
| context.lineTo(250,125) | |
| context.lineTo(80,250) | |
| context.lineTo(150,50) | |
| //O desenho não é de verdade enquanto você | |
| //não mandar o contexto pintá-lo. | |
| //Vamos pintar o interior de amarelo | |
| context.fillStyle='#ff0' | |
| context.fill() | |
| //Vamos pintar as linhas de vermelho. | |
| context.strokeStyle='#f00' | |
| context.stroke() | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment