How to use the pdf-lib.drawImage function in pdf-lib

const MARIO_PNG_WIDTH = marioPngDims.width * 0.15;
const MARIO_PNG_HEIGHT = marioPngDims.height * 0.15;

// Here, we define a new "content stream" for the page. A content stream is
// simply a sequence of PDF operators that define what we want to draw on the
// page.
const newContentStream = pdfDoc.createContentStream(
  // `drawImage` is a "composite" PDF operator that lets us easily draw an image
  // on a page's content stream. "composite" just means that it is composed of
  // several lower-level PDF operators. Usually, you'll want to work with
  // composite operators - they make things a lot easier! The naming convention
  // for composite operators is "draw".
  //
  // Here we draw the image of Mario on the page's content stream. We'll draw
  // him centered horizontally in the top half of the page.
  drawImage(MARIO_PNG, {
    x: 200,
    y: 350,
    width: MARIO_PNG_WIDTH,
    height: MARIO_PNG_HEIGHT,
  }),
  // Now let's draw 2 lines of red Courier text near the bottom of the page.
  drawLinesOfText(['This text was added', 'with JavaScript!'], {
    x: 30,
    y: 150,
    font: COURIER_FONT,
    size: 48,
    colorRgb: [1, 0, 0],
  }),
);

// Here we (1) register the content stream to the PDF document, and (2) add the

const TEXT_BOX_WIDTH = 295;

// Let's define some RGB colors. Note that these arrays are of the form:
//   [, , ]
// where each color value must be in the range 0.0-1.0. Note that they should
// *not* be in the range 0-255 as they would be if you were writing CSS styles.
const SOLARIZED_WHITE = [253 / 255, 246 / 255, 227 / 255];
const SOLARIZED_GRAY = [101 / 255, 123 / 255, 131 / 255];

// Here, we define the second page's "content stream". A content stream is
// simply a sequence of PDF operators that define what we want to draw on the
// page.
const contentStream2 = pdfDoc.createContentStream(
  // Here we draw the image of Mario on the page's content stream. We'll draw
  // him centered horizontally in the top half of the page.
  drawImage(MARIO_PNG, {
    x: PAGE_2_WIDTH * 0.5 - MARIO_PNG_WIDTH * 0.5,
    y: PAGE_2_HEIGHT * 0.5,
    width: MARIO_PNG_WIDTH,
    height: MARIO_PNG_HEIGHT,
  }),
  // Next we'll draw a Solarized White rectangle with a Solarized Gray border
  // beneath the image of Mario. It will be centered horizontally in the page.
  drawRectangle({
    x: PAGE_2_WIDTH * 0.5 - TEXT_BOX_WIDTH * 0.5,
    y: PAGE_2_HEIGHT * 0.5 - 100,
    width: TEXT_BOX_WIDTH,
    height: 90,
    colorRgb: SOLARIZED_WHITE,
    borderWidth: 4,
    borderColorRgb: SOLARIZED_GRAY,
  }),

drawText('This PDF was Created with JavaScript!', {
    x: 85,
    y: PAGE_1_HEIGHT - 48,
    font: HELVETIVA_FONT,
    size: 24,
  }),
  drawText(helveticaFont.encodeText('Olé! - Œ'), {
    x: PAGE_1_WIDTH * 0.5 - 30,
    y: PAGE_1_HEIGHT - 48 - 30,
    font: HELVETIVA_FONT,
    size: 12,
  }),
  // Now we'll draw the Unicorn image on the page's content stream. We'll
  // position it a little bit below the text we just drew, and we'll center it
  // within the page.
  drawImage(UNICORN_JPG, {
    x: PAGE_1_WIDTH * 0.5 - UNICORN_JPG_WIDTH * 0.5,
    y: PAGE_1_HEIGHT * 0.5,
    width: UNICORN_JPG_WIDTH,
    height: UNICORN_JPG_HEIGHT,
  }),
  // Finally, let's draw an ellipse on the page's content stream. We'll draw it
  // below the image we just drew, and we'll center it within the page. We'll
  // color it cyan, with a purple border.
  drawEllipse({
    x: PAGE_1_WIDTH * 0.5,
    y: PAGE_1_HEIGHT * 0.2,
    xScale: 150,
    yScale: 50,
    borderWidth: 15,
    colorRgb: CYAN,
    borderColorRgb: PURPLE,