Foros aprenderaprogramar.com

Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: pedro,, en 21 de Febrero 2016, 16:09

Título: Api Canvas HTML y JavaScript Dibujar rectángulo de color o bandera país CU01195E
Publicado por: pedro,, en 21 de Febrero 2016, 16:09
Y otro más, ejercicio CU01195E del tutorial javascript desde cero.

Citar
EJERCICIO OPCIONAL

Este ejercicio no forma parte del curso, por eso se califica como opcional. El ejercicio consiste en dibujar la bandera de tu país usando canvas y JavaScript. La respuesta al ejercicio debe ser el código que genere la bandera.

Código: [Seleccionar]
<!DOCTYPE html>
<html>
  <head>
<title>Bandera Ejercicio CU01195E, https://www.aprenderaprogramar.es/</title>
    <meta charset="utf-8"/>   
<script>
function dibujaBandera(){
var ctx = document.getElementById ('canvas');
var contenido = ctx.getContext ('2d');
   
//Rectángulo superio, rojo
contenido.fillStyle = 'red';
contenido.fillRect (55, 55, 400, 60);

//Rectángulo intermedio, amarillo
contenido.fillStyle = 'yellow';
contenido.fillRect (55, 115, 400, 50);

//Rectángulo inferior, rojo
contenido.fillStyle = 'red';
contenido.fillRect (55, 165, 400, 60);
}
</script>
</head>
<body onload="dibujaBandera()">
<canvas id="canvas" width="400" height="300"></canvas>
</body>
</html>

Saludos.
Título: Re:Api Canvas HTML y JavaScript Dibujar rectángulo de color o bandera país CU01195E
Publicado por: Mario R. Rancel en 24 de Febrero 2016, 09:19
Buenos días Pedro, perfecto también. La idea era ver cómo el api canvas nos facilita dibujar usando javascript. Queda claro con tu código.

Saludos