renderPage method
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();
}