1<html>
2 <script src="../lib/core/CoreControls.js"></script>
3 <script src="../lib/core/pdf/PDFNet.js"></script>
4 <script>
5 (async function() {
6 CoreControls.setWorkerPath('../lib/core');
7 const doc = await PDFNet.PDFDoc.createFromURL(filename);
8 const page = await doc.getPage(1);
9
10 const initCfg = await doc.getOCGConfig();
11 const ctx = await PDFNet.OCGContext.createFromConfig(initCfg);
12
13 const pdfdraw = await PDFNet.PDFDraw.create();
14 pdfdraw.setImageSize(1000, 1000);
15 pdfdraw.setOCGContext(ctx);
16
17 // Disable drawing of content that is not optional (i.e. is not part of any layer).
18 ctx.setNonOCDrawing(false);
19
20 // Now render each layer in the input document to a separate image.
21 const ocgs = await doc.getOCGs(); // Get the array of all OCGs in the document.
22 let i;
23 const sz = await ocgs.size();
24 for (i = 0; i < sz; ++i) {
25 const ocg = await PDFNet.OCG.createFromObj(await ocgs.getAt(i));
26 ctx.resetStates(false);
27 ctx.setState(ocg, true);
28 let fname = 'pdf_layers_';
29 fname += await ocg.getName();
30 fname += '.png';
31 const pageBuffer = await pdfdraw.exportStream(page);
32
33 //optionally save the blob to a file or upload to a server
34 const layerBlob = new Blob([pageBuffer], { type: 'image/png' });
35 }
36
37 // Now draw content that is not part of any layer...
38 ctx.setNonOCDrawing(true);
39 ctx.setOCDrawMode(PDFNet.OCGContext.OCDrawMode.e_NoOC);
40 const nonLayerBuffer = await pdfdraw.exportStream(page);
41
42 // optionally save the blob to a file or upload to a server
43 const nonLayerBlob = new Blob([nonLayerBuffer], { type: 'image/png' });
44 })()
45 </script>
46</html>