renderPage method

Future<Uint8List> renderPage(
  1. PdfJsPage page,
  2. PdfJsViewport viewport,
  3. double scale,
  4. String documentID,
)

Renders the page into a canvas and return image's byte information.

Implementation

Future<Uint8List> renderPage(PdfJsPage page, PdfJsViewport viewport,
    double scale, String documentID) async {
  final html.CanvasElement htmlCanvas =
      js.context['document'].createElement('canvas');
  final Object? context = htmlCanvas.getContext('2d');
  final _viewport = page.getViewport(_settings);
  if (scale < 2) {
    scale = 2;
  }
  viewport = page.getViewport(Settings()
    ..scale = ((viewport.width).toInt() * scale) / _viewport.width);

  htmlCanvas
    ..height = viewport.height.toInt()
    ..width = viewport.width.toInt();
  final renderSettings = Settings()
    ..canvasContext = (context as html.CanvasRenderingContext2D)
    ..viewport = viewport;
  await promiseToFuture<void>(page.render(renderSettings).promise);

  // Renders the page as a PNG image and retrieve its byte information.
  final completer = Completer<void>();
  final blob = await htmlCanvas.toBlob();
  final bytesBuilder = BytesBuilder();
  final fileReader = html.FileReader()..readAsArrayBuffer(blob);
  fileReader.onLoadEnd.listen(
    (html.ProgressEvent e) {
      bytesBuilder.add(fileReader.result as List<int>);
      completer.complete();
    },
  );
  await completer.future;
  return bytesBuilder.toBytes();
}