How to zoom the particular portion of PDF using ng2-pdf-viewer?

Question

I am loading a PDF using ng2-pdf-viewer. I am having one label over the PDF. When I click the label, I need to show the specific part of PDF. As of now I am using pdf.js which is inbuilt in ng2-pdf-viewer to render the portion of pdf and render it in the canvas. Based on the coordinates startX, startY, width and height of specific portion which is given dynamically

Is this correct method or do we have any other option to show the portion of pdf using ng2-pdf-viewer.

Because the canvas is not responsive to all resolutions, when I use the css for canvas, it is blur,So I need the output should be quality and responsive to all resolutions.

This is my logic

renderPageToCanvas(currentData: any, preCanvas: any, pdfEvent: any, isHover: boolean) {
  let canvas = preCanvas.nativeElement;
  let context = canvas.getContext('2d');

  var factor_calc: any = 1.9 + (0.003 * (953 - window.innerHeight));
  const factor = Number(factor_calc.toFixed(1));

  let rectCoordinates = isHover ? {
    x: currentData.canvas_StartX / factor,
    y: currentData.canvas_StartY / factor,
    width: currentData.canvas_Width / factor,
    height: currentData.canvas_Height / factor
  } : {
    x: currentData.canvas_StartX,
    y: currentData.canvas_StartY,
    width: currentData.canvas_Width,
    height: currentData.canvas_Height
  };

  canvas.width = rectCoordinates.width;
  canvas.height = rectCoordinates.height;

  if (pdfEvent) {
    pdfEvent.getPage(currentData.pageNumber).then((page: any) => {
      const scaling = isHover ? currentData.scale / factor : currentData.scale;
      const adjustedViewport = page.getViewport({
        scale: scaling,
        offsetX: -rectCoordinates.x,
        offsetY: -rectCoordinates.y
      });

      const renderContext = {
        canvasContext: context,
        viewport: adjustedViewport
      };
      const renderTask = page.render(renderContext);
      renderTask.promise.then(() => {
        const imageData = context.getImageData(0, 0, rectCoordinates.width, rectCoordinates.height);
        context.clearRect(0, 0, canvas.width, canvas.height);
        context.putImageData(imageData, 0, 0);
      }).catch((error: any) => {
        console.error('Page rendering failed', error);
      });
    });
  }
}

Is this correct method or do we have any other option to show the portion of pdf using ng2-pdf-viewer. How it should be improve the quality of canvas and responsive to all resolutions.