Pdf.js: Tidak dapat menggunakan kanvas yang sama selama beberapa operasi render()

Dibuat pada 28 Agu 2018  ·  13Komentar  ·  Sumber: mozilla/pdf.js

Menggunakan versi pdfjs terbaru (2.0.550) saya mendapatkan kesalahan berikut:

Tidak dapat menggunakan kanvas yang sama selama beberapa operasi render().

Kode yang saya gunakan untuk rendering adalah sebagai berikut:

function renderPage(pageNumber, renderOptions) {
                var documentId = renderOptions.documentId;
                var pdfDocument = renderOptions.pdfDocument;
                var scale = renderOptions.scale;
                var rotate = renderOptions.rotate;
                // Load the page and annotations
                return Promise.all([pdfDocument.getPage(pageNumber), _PDFJSAnnotate2.default.getAnnotations(documentId, pageNumber)]).then(function (_ref) {
                    var _ref2 = _slicedToArray(_ref, 2);
                    var pdfPage = _ref2[0];
                    var annotations = _ref2[1];
                    var page = document.getElementById('pageContainer' + pageNumber);
                    var svg = page.querySelector('.annotationLayer');
                    var canvas = page.querySelector('.canvasWrapper canvas');
                    var canvasContext = canvas.getContext('2d', {alpha: false});
                    var viewport = pdfPage.getViewport(scale, rotate);
                    var transform = scalePage(pageNumber, viewport, canvasContext);
                    var renderContext = {
                        canvasContext: canvasContext,
                        viewport: viewport,
                        transform: transform
                    };
                    // Render the page
                    return Promise.all([pdfPage.render(renderContext), _PDFJSAnnotate2.default.render(svg, viewport, annotations)]).then(function () {
                        // Text content is needed for a11y, but is also necessary for creating
                        // highlight and strikeout annotations which require selecting text.
                        return pdfPage.getTextContent({normalizeWhitespace: true}).then(function (textContent) {
                            return new Promise(function (resolve, reject) {// Render text layer for a11y of text content
                                var textLayer = page.querySelector('.textLayer');
                                var textLayerFactory = new pdfjsViewer.DefaultTextLayerFactory();
                                var textLayerBuilder = textLayerFactory.createTextLayerBuilder(textLayer, pageNumber - 1, viewport);
                                textLayerBuilder.setTextContent(textContent);
                                textLayerBuilder.render();// Enable a11y for annotations
                                // Timeout is needed to wait for `textLayerBuilder.render`
                                setTimeout(function () {
                                    try {
                                        (0, _renderScreenReaderHints2.default)(annotations.annotations);
                                        resolve();
                                    } catch (e) {
                                        reject(e);
                                    }
                                });
                            });
                        });
                    }).then(function () {// Indicate that the page was loaded
                        page.setAttribute('data-loaded', 'true');
                        return[pdfPage, annotations];
                    });
                });
            }

Bagian kode itu dari proyek anotasi js:
https://github.com/instructure/pdf-annotate.js/blob/master/docs/index.js

Seperti yang Anda juga bisa lihat, setiap halaman memiliki kanvasnya sendiri. Jadi, saya tidak tahu mengapa saya masih mendapatkan kesalahan seperti itu.

Apa yang salah dan di mana saya harus memeriksanya?

1-other

Komentar yang paling membantu

Setiap pembaruan tentang masalah ini?

Semua 13 komentar

@atnsm bro bisakah saya tahu apakah Anda menggunakan PDF-anotasi di Angular 2+?

Saya kira tidak demikian. Berikut adalah daftar semua dependensi:
https://github.com/instructure/pdf-annotate.js/blob/master/package.json

Masalah yang sama, bagaimana cara memperbaikinya.

Melihat kesalahan yang sama dengan react-pdf-js yang merupakan pembungkus pdfjs-dist .

Menggunakan versi pdfjs terbaru (2.0.550) saya mendapatkan kesalahan berikut:

Sangat mungkin bahwa masalah ini adalah duplikat dari #9456, dalam hal ini telah diperbaiki oleh PR #9853 (yang tidak tepat waktu untuk dimasukkan dalam versi 2.0.550 ).

Saya juga akan mengatakan demikian. Mari kita tutup ini dan kita selalu dapat membuka kembali jika rilis 2.0 final selesai dan masalahnya tetap ada.

Saya mengalami masalah yang sama. Bantuan diperlukan.

Setiap pembaruan tentang masalah ini?

Saya mendapatkan masalah ini ketika saya menggunakan pdfjs di sudut 8. harap dapat membantu seseorang:

publik ngOnDestroy() {
jika (ini._pdf) {
this._pdf.destroy();
}
if (this.renderTask) {
this.renderTask.cancel();
}
}
dalam fungsi render, Anda harus mendapatkan elemen kanvas dengan: this.element.nativeElement.children[0] alih-alih kueri dengan dokumen dom

Setiap pembaruan tentang masalah ini?

Saya mengalami masalah yang sama, menggunakan satu kanvas untuk menampilkan dokumen dan pengguna dapat memilih salah satu dari beberapa dokumen untuk ditampilkan

Saya mengalami masalah yang sama, menggunakan satu kanvas untuk menampilkan dokumen dan pengguna dapat memilih salah satu dari beberapa dokumen untuk ditampilkan

Anda harus membatalkan kemudian menghancurkan proses render pdf sebelum Anda dapat membuat file pdf baru

Bisakah seseorang menjelaskan cara yang tepat untuk membatalkan dan merender ulang halaman yang sama?

Dari masalah lain yang saya lihat, Anda tidak boleh menggunakan kanvas yang sama untuk menjalankan dua tugas render sekaligus. Dan Anda harus menunggu yang sebelumnya selesai (yang tidak ingin saya lakukan) atau membatalkannya.

Tetapi memanggil cancel pada tugas sebelumnya masih tidak menyelesaikan masalah di mana terkadang halaman dirender terbalik, yang seharusnya terjadi jika Anda menjalankan dua tugas render di kanvas yang sama.

Solusi @ huannxdev juga mengharuskan Anda untuk menghancurkan pdf. Tapi saya tidak mau harus memuat ulang hanya untuk merender ulang satu halaman.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat

Masalah terkait

dmisdm picture dmisdm  ·  3Komentar

sujit-baniya picture sujit-baniya  ·  3Komentar

aaronshaf picture aaronshaf  ·  3Komentar

AlexP3 picture AlexP3  ·  3Komentar

timvandermeij picture timvandermeij  ·  4Komentar