Insert an image into HTML5 canvas

There are two problems with your code:

1) the main one: very likely the script loads and executes before finishing the DOM loading, thus, you may not have the "myCanvas" element when calling: document.getElementById('myCanvas');.
2) since you use local files, but with a full path (e.g., c:\...") you should specify the protocol, so use "file://C:/Users/User/Documents/folder1/Image Folder/Image1.jpg". While in some browsers may still work without specifying the protocol, it is recommended to use the protocol when using full URLs/URIs (including full paths from local drives!).

The complete code is:

window.addEventListener("load", function() {
  var canvas = document.getElementById('myCanvas');
  var context = canvas.getContext('2d');
  var context1 = canvas.getContext('2d');
  var context2 = canvas.getContext('2d');
  var centerX = canvas.width / 2;
  var centerY = canvas.height / 2;
 
  var x = centerX;
  var y = centerY;
  var imageObj = new Image();
  imageObj.src = 'file://C:/Users/User/Documents/folder1/Image Folder/Image1.jpg';
  imageObj.onload = function () {
    context.drawImage(imageObj, x, y);
  };
});

In addition, formatting your code is a good idea and also don't use "var" for each variable in the same block or method, just coma separate the variables.