oigan no me funciona esta parte: var lienzo = dado.getContext("2d"); estoy triste :"v alguien que me ayude

Giovanni Israel Nieves Rodríg

Pregunta

student•hace 7 años

Jorge Enrique Quimbaya Gómez

student•hace 3 años

var _d = document.getElementById("dibujito");
var _lienzo = _d.getContext("2d");
console.log(_lienzo)```

Anjel Santiago Hernandez Ramirez

student•hace 3 años

ESTE ERROR SIGUE SIN RESOLVERSE AIUDA :,V!

<code>
var d = document.getElementById("dibujito");
var lienzo = d.getContext("2d");
var lineas = 30;
var l = 0;
var yi, xf;
while (l < lineas)
{
  yi = 10 * l;
  xf = 10 * (l + 1);
  dibujarLinea("#AFA", 1, 1, 1, 300);
  console.log("lineas" + l);
  l = l + 2;
}
function dibujarLinea( color, xinicial, yinicial, xfinal, yfinal)
{
  lienzo.beginPath( );
  lienzo.strokeStyle = color;
  lienzo.moveTo(xinicial, yfinal);
  lienzo.lineTo(xinicial, yfinal);
  lienzo.stroke();
  lienzo.closePath();
}
html
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>dibujito</title>
  </head>
  <body>
    <<h1>dibujo en canvas</h1>
    <canvas width="300"height="300"id="dibujito"></canvas>
    <p>haci queda tu dibujo</p>
    <script src="dibujo.js">
      </script>

  </body>
</html>

Nathaly Zabala Alvarez

student•hace 3 años

Para las personas que a penas estén haciendo el curso si se les presenta este problema y han hecho de todo y no se les soluciona, vayan al archivo HTML y en el body fíjense bien si primero está el script o canvas, si primero pusieron el scrip ahí está el error, primero debe ir el canvas ====

GOOD===

BAD===

LUIS FERNANDO TORO HERRERA

student•hace 3 años

Hola a todos. La forma en la que pude solucionar este problema donde no me reconocía el get.Context("2d") lo resolví así:

Noté que el problema que se me estaba presentando era en el recomocimiento de las variables, porque ("Atom") el editor de código en el que estoy trabajando no se porqué no las sujería al momento de querer llamarlas, por lo que intenté declararlas primero y luego hacer las asignaciones.

var _draw; var _board; _draw = document.getElementById("dibujito"); _board = _draw.getContext("2d"); console.log(_board);

y el problema de no reconocer el canvas desapareció.

Fabrizio Alejandro Gonzales Peceros

student•hace 3 años

Podrian probar guardando primero el html y luego el js, a mi me funciono. Ya que si tu problema es que dice que no lo puede leer el getContext(), puede ser que guardastes primero el js antes del html

ALEJANDRO RAMOS FUENTES

student•hace 3 años

Yo estaba intentado plantear estos cambios en react , y esta plataforma me ayudo a corregir los errores que aparecen en getContext , en resumen es un poco mas avanzado pero con un useEffect se puede corregir , reitero esto es para implementarlo en React js

Joseth Steven Calderón Corredor

student•hace 3 años

Hola a todos. No estoy seguro si todavía hay personas con esta misma inquietud, sin embargo, yo también tuve este problema y dure bastante tiempo en hallar la solución a esto. Mi problema no era el orden, el id o alguna letra o espacio. Mi problema radicaba en copiar y pegar el código como lo hizo el profe Freddy, yo no estoy seguro si es por el programa que yo utilizo(Yo uso visual studio code), pero en ocasiones cuando tu copias y pegas el código se va a ejecutar mal (Aunque este bien). Si ves que tu código esta bien y si tu sientes que esta todo en su lugar y en orden, trata de revisar tu código tantas veces sea necesaria hasta cuando estés totalmente seguro que todo esta perfecto... Si es así y el problema persiste, intenta borrar ese código y vuelve hacer ese pedazo de código, tomate tu tiempo y cuando termines de escribirlo estoy seguro que te saldrá bien.

Javier Ramirez

student•hace 3 años

a mi tampoco me funciona

les dejo el html, y el js

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>dibujando con canvas</title> </head> <body> <h1>dibujo en canvas</h1> <canvas width="300" height="300" id="dibujito"></canvas> <p>asi queda tu dibujo</p> <script src="dibujo.js"></script> </body> </html>

dibujo.js

var d = document.getElementById("dibujito"); var lienzo = d.getContext("2d");

lienzo.beginPath(); lienzo.strokeStyle = "red"; lienzo.moveTo(100, 100); lienzo.lineTo(200, 200); lienzo.strokeStyle(); lienzo.closePath();

Diana Garzón

student•hace 3 años

Buenas, ¡como estan! no me muestra el trazo de la linea y ya realice los cambios de colocar primero la linea de canvas y luego script, y cambiar el orden de Id al inicio y final y no funciona. si, alquien me puede ayudar, dejo las imagenes del Html- js.Gracias

!html

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>drawn with arrows</title> </head> <body> <canvas width="300" height="300" id = "drawing area"></canvas> <p> Move the Keyboard´s arrows to drawn</p> <script src="events - copia.js"></script> </body> </html>

var keys = { UP: 38, DOWN: 40, LEFT: 37, RIGTH: 39 };

document.addEventListener("keyup", drawKeyboard); var box = document.getElementById("drawing area"); var paper = box.getContext("2d");

drawline("red", 100, 100, 200, 200, paper);

function drawline(colour, xinitial, xfinal, yinitial, yfinal, canvas) { canvas.beginPath(); canvas.strokeStyle = colour; canvas.moveTo(xinitial, yinitial); canvas.lineTo(xfinal, yfinal); canvas.stroke(); canvas.closePath(); }

function drawKeyboard(event) { switch (event.keyCode) { case keys.UP: console.log("up"); break; case keys.DOWN: console.log("down"); break; case keys.LEFT: console.log("left"); break; case keys.RIGTH: console.log("rigth"); break; default: console.log("other key"); break; } }

Sebastian Jaramillo Velez

student•hace 3 años

A mi me pasaba porque en html deje un renglon entre el script y el body.

oigan no me funciona esta parte: var lienzo = dado.getContext("2d"); estoy triste :"v alguien que me ayude

Curso Gratis de Programación Básica

Curso Gratis de Programación Básica