Is there a way to properly access the ctx in the function loadImage? Despite encountering functional code snippets, I have struggled to make it work. Every time I attempt it, I receive error messages indicating that 'this', 'this.ctx', or 'ctx' is undefined.
var MyClass = function(canvasId){
var canvas = document.getElementById(canvasId);
var ctx = canvas.getContext("2d");
};
MyClass.prototype.loadImage = function(imageSrc){
var image = new Image();
image.src = imageSrc;
// struggling to access this or ctx here
image.onload = function(){
this.ctx.drawImage(image, 0, 0);
};
// unable to access it even at this stage:
ctx.drawImage(image, 0, 0);
};
// uncomment below to test
// window.onload = function(){
// var myObject= new MyClass("myCanvas");
// myObject.loadImage('myImage.jpg');
// }