Jump to content

jl-p

Members
  • Posts

    4
  • Joined

  • Last visited

jl-p's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. yeah i know but how to fix it. because the other example with the object name instead of numbers does work.
  2. Also tried this. and then i receive only one picture <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); var imageObj = new Image(); var source = []; source[0] = 'http://eindtijdinbeeld.nl/EiB-Dispensationalisme/01.png'; source[1] = 'http://upload.wikimedia.org/wikipedia/commons/f/f7/MetroDF_Linea_2.jpg'; for (z=0;z<2;z++){ var imageObj1 = new Image(); imageObj1.onload = function() {context.drawImage(imageObj1, 69+(z*100), 50);}; imageObj1.src=source[z]; } </script>
  3. Yes i know. but this is how the example i found worked. But how do i do that so it keeps working. because i changed it several times and then i only get one of the pictures or none. when i use a normal array. So i do something wrong but don't see it.
  4. Hi, I want to load my images based on a variable. I don't want to use a fixed name in the context.drawImage(images.a0, so i want to load my pictures for example as in for (z=0;z<3;z++){ context.drawImage(images[z], 100+(z*100), 30, 200, 137); } <canvas id="myCanvas" width="578" height="200"></canvas> <script> function loadImages(sources, callback) { var images = {}; var loadedImages = 0; var numImages = 0; // get num of sources for(var src in sources) { numImages++; } for(var src in sources) { images[src] = new Image(); images[src].onload = function() { if(++loadedImages >= numImages) { callback(images); } }; images[src].src = sources[src]; } } var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); var sources = { a0: 'http://eindtijdinbeeld.nl/EiB-Dispensationalisme/01.png', a1: 'http://upload.wikimedia.org/wikipedia/commons/f/f7/MetroDF_Linea_2.jpg', a2: 'http://www.sundayschoolleader.com/wp-content/uploads/2014/08/number-3.jpg' }; loadImages(sources, function(images) { context.drawImage(images.a0, 100, 30, 200, 137); context.drawImage(images.a1, 350, 55, 93, 104); });
×
×
  • Create New...