function drawCanvas6() {
  var canvas = document.getElementById('canvas6');
  if (canvas && canvas.getContext) {
    var ctx = canvas.getContext('2d');                // Get the context : 2 dimensions
    var img = new Image();                            // Create the image
    img.src = './images/canvas/grid.png';             // Set the source of the image
    img.onload = function() {                         // Define loading process
      ctx.drawImage(img, 0, 0);                       // Draw the image
      var g = ctx.createLinearGradient(0,0,150,150);  // Create the gradient
      g.addColorStop(0,'rgba(0,155,208,0.97)');       // Set the start to light blue 97% opacity
      g.addColorStop(1,'rgba(0,111,163,0.97)');       // Set the end to dark blue 97% opacity
      ctx.strokeStyle = 'rgba(150,150,150,0.7)';      // Set the fill to blue 70% opacity
      drawStatRectangle(ctx, 15,  74, 31,  70, g);    // Draw the first rectangle
      drawStatRectangle(ctx, 55, 124, 31,  20, g);    // Draw the second rectangle
      drawStatRectangle(ctx, 95,  24, 31, 120, g);    // Draw the third rectangle
    }
  }
}

function drawStatRectangle(ctx, x, y, lx, ly, g) {
  ctx.strokeRect(x-2, y-2, lx+4, ly);                 // Draw the outer border
  ctx.fillStyle = 'rgba(255,255,255,0.7)';            // Set inner border to white 40% opacity
  ctx.fillRect(x-2, y-2, lx+4, ly+2);                 // Draw the inner border
  ctx.fillStyle = g;                                  // Set the fill with the gradient
  ctx.fillRect(x, y, lx, ly);                         // Fill the rectangle
}