[basico] canvas no muestra el lienzo

cesand209 · #1 (**permalink**) 10/03/2014, 12:16

hola gente estoy empezando con html5 provando el canvas..

estoy con este codigo pero no se si no me crea el lienzo o es solo que no lo pinta con color.

Código HTML:

Ver original<!DOCTYPE  html>
<html>
    <head>
        <title>Canvas con html5</title>
        <script type="text/javascript">
            function cargador1(){
                var li = document.getElementById('lienzo1')
                var lienzo1 = li.getContext('2d')
                
                lienzo1.fillStyle = "rgba(0,0,200,1)"
                lienzo1.fillRect('45,50,35,100')
                
                
            }
        </script>
        <style type="text/css">
            /*#linenzo1{
        
            }*/
        </style>
    </head>
<body onload="cargador1()">
    
    <h3>Practica con canvas en html5</h3>
    <h4>Primer sienzo</h4>
    <canvas id="lienzo1" height="600" width="650"> </canvas>
 
</body>
</html>

alguna ayuda?

maycolalvarez · #2 (**permalink**) 10/03/2014, 12:52

tienes errores de sintaxis en javascript, usa una consola para detectarlos, básicamente te faltan los ; al final

cesand209 · #3 (**permalink**) 10/03/2014, 13:50

pero yo nunca uso los ; al final de las lineas javasvript. en base a esto no cambio nada seguramente no?

PHPeros · #4 (**permalink**) 10/03/2014, 15:16

Cita:

Iniciado por maycolalvarez

tienes errores de sintaxis en javascript, usa una consola para detectarlos, básicamente te faltan los ; al final

Esos son los estragos de estar acostumbrado a programar en PHP

En JavaScript muy pocas veces es necesario añadir el punto y coma al final de las declaraciones, a diferencia de PHP

cesand209 · #5 (**permalink**) 11/03/2014, 12:04

AHH me parecia venia por ese lado, de todas formas esta bien gracias por la ayuda. No logro hacer andar ese codigo canvas aun.. alguna otra sugerencia?

maycolalvarez · #6 (**permalink**) 12/03/2014, 12:25

Ok, lo primero es descartar la sintaxis, por ello lo dije.

Si hubieses utilizado una consola web ya detectarías que el error se produce porque estás pasando los parámetros del fillRect como una cadena, cuando debería ser:

Código Javascript:

Ver originallienzo1.fillRect(45,50,35,100)

cesand209 · #7 (**permalink**) 12/03/2014, 19:43

muchicimas gracias maycolalvarez efectivamente. pido disculpas aproveche para verlo con firebug ya que no estaba muy familiarizado a depurar javascript con la consola y ver como mostraba el error.

te agradezco nuevamente