I would like to know if it was possible to put an image in the background instead of a color?

I've been stuck for a few days and can't find a solution ...

here you will find my jsfiddle : https://jsfiddle.net/kna3et87/

thank you very much for any help :) !!

Here I call on my variables

var balls = function() {
  
  /* configuration */
  var BALL_NUMBER    = 100;
  var BALL_SIZE      = 60;
  var BALL_COLOR     = "red";
  var BACK_COLOR     = "fff";
  var GRAVITY_X      = 0;
  var GRAVITY_Y      = 0.5;
  var MOUSE_REPEL    = false;
  var MOUSE_STRENGTH = 1.4;
  var BOUNCINESS     = 0.8;
  var FRICTION       = 1.01;
  var WALL_STICK     = false;
  var WALL_BOUNCE    = true;
  var STICKINESS     = 50;

 

And here my parameters :

context.beginPath();
        context.fillStyle = BALL_COLOR;
        context.arc(this.x, this.y, BALL_SIZE / 2, 0, Math.PI * 2, true);
        context.closePath();
        context.fill();