This final installment in our series dives into the advanced functionality of viewing PDFs within Canvas Apps. By leveraging Power Automate, SharePoint, and the PDF Viewer component in Canvas Apps, you can create a rich, searchable, and interactive PDF experience.
Components Involved
- Canvas App PDF Viewer: As of the time of writing, this component is in preview but offers functionality like zoom, scroll, and keyword search within the PDF.
- Data URI: This is the crucial link that feeds the PDF into the Canvas App.
- Power Automate: On-the-fly automation to fetch the PDF from SharePoint and generate the Data URI.
Step-by-Step Guide
You will want a canvas app that has a gallery alongside showing a filtered list of documents from which the user will select. Here is an example:
1. Canvas App Configuration
When a user selects a PDF from a gallery within the Canvas App, a Power Automate flow is triggered. In the Canvas App I have a button on each gallery item that selects the parent component.
btn_Select:OnSelect= (Select(Parent)
This then triggers the following code for the Gallery> OnSelect Property. I am passing the flow the needed identifier to find the document in the SharePoint Library.
Gallery: OnSelect = Set( vPDF, GetDataURI.Run(galInvoiceNumbers.Selected.’Invoice Number’).result)
This code is setting a variable (vPDF) to equal the result of our dataURI generating flow. The variable vPDF is inside the PDF viewer’s Document property:
2. Fetch and Generate Data URI
The flow is very basic, getting file content from SharePoint and then generating the Data URI as a result.
Key expression: datauri(base64ToBinary(body(‘Get_file_content_using_path’)?[‘$content’]))
3. Display in PDF Viewer
The Data URI is sent back to the Canvas App, where the PDF Viewer component renders it.
Advanced Filtering with Power Fx
Use Power Fx to pre-filter the gallery of available PDFs. For example, in a medical scenario, you could filter to only show PDFs related to the current patient’s record.
Integration with Power BI
This technique can be extended to an embedded Canvas App within a Power BI report, allowing for real-time invoice viewing and powerful data filtering capabilities.
Benefits
- Full PDF Functionality: Users can search within the PDF, zoom in/out, and scroll through pages.
- Dynamic Data Filtering: Whether it’s through Power Fx in Canvas Apps or Power BI’s filtering engine, you get real-time, relevant data.
- Ease of Use: Users can effortlessly locate and view PDFs, making the system highly user-friendly.
Conclusion
This technique offers a unified experience by integrating the best features of Canvas Apps, SharePoint, and Power BI. It enables users to access relevant PDFs quickly and easily, enhancing productivity and data interaction.
For more, check out the other posts in this series:
