Spanish, Mexican subtitles

← PS 03-05 Carga de imágenes

Get Embed Code
8 Languages

Showing Revision 5 created 01/28/2015 by maritzabd76.

  1. La mayor parte de la interacción del canvas que usa GRITS , es a través de imagenes renderizadas para
  2. el canvas. Para dibujar una imagen en el canvas,
    primero tenemos que cargarla.
  3. Para cargar una imagen, se necesita crear
    un nuevo objeto de imagen, lo cual en
  4. Javascript se compone de tres pasos. Número 1, tenemos que declarar el...
  5. objeto de imagen. Número 2, definir su función de carga "onload". Y número 3...
  6. tenemos que establecer el atributo "image.source".
    Se debe señalar que en tanto la...
  7. si la propiedad fuente de esta imagen se le fija un valor
    Javascript arrancará...
  8. la función "onload". Por esto, tenemos que especificar
    la función de llamada primero,
  9. antes de establecer el atributo de fuente. De lo contrario, la imagen cargará los datos...
  10. y no recibiremos una respuesta.
  11. Ahora, echemos un vistazo al código.
    Esta es la URL de la imagen que nos gustaría...
  12. que cargaras. Queremos que crees
    un nuevo objeto de imagen siguiendo...
  13. los pasos mencionados, y que establezcan la función "onload" y las propiedades de origen para...
  14. esa imagen descrita en el código.
    Asegúrate de que la función "onload"...
  15. se asigne a este "onImageLoad" aquí abajo,
    que desplegará...
  16. un mensaje en el registro de la consola para informar
    que todo se ha cargado...
  17. correctamente. Si tienen dudas
    sobre si la imagen se está cargando...
  18. no olviden revisar las herramientas de desarrollo de Chrome en la ficha de red (network); allí se indicará...
  19. si la imagen se ha cargado,
    y cuánto tiempo se demoró en cargar.