Wat is de oorzaak van deze foutmelding in Javascript?
Foutmelding:
Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)
Code die ik schrijf:
var CANVAS_BREEDTE = 1366;
var CANVAS_HOOGTE = 100;
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
canvas.width = CANVAS_BREEDTE;
canvas.height = CANVAS_HOOGTE;
document.body.appendChild(canvas);
var x = document.getElementById("myinput");
if (x.value == "alpha-bet") {
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
var images;
var image1 = new Image();
image1.src = "file:///Users/saskyaa/Desktop/Nieuwe%20Website/mario.png";
var image2 = new Image();
image2.src = "file:///Users/saskyaa/Desktop/Nieuwe%20Website/dice.png";
var image3 = new Image();
image3 = "file:///Users/saskyaa/Desktop/Nieuwe%20Website/banana.png";
var image4 = new Image();
image4.src = "file:///Users/saskyaa/Desktop/Nieuwe%20Website/Banana2.gif";
var x = Math.floor(Math.random() * 700);
var y = Math.floor(Math.random() * 1280);
var image = Math.floor(Math.random() * 4);
if (image <= 1) {
images = image1;
} else if (image == 2) {
images = image2;
} else if (image == 3) {
images = image3;