Update of Jan, 2024: We opened source visual card of Power BI of APS Viewer (it was called Endymion). It allows you to integrate the Viewer into Microsoft Power BI and access model's metadata. The new repository has been available at https://github.com/autodesk-platform-services/aps-powerbi-tools .
-----------------
Update of August, 2022, This experiment of this blog is just for reference about the basic skeleton of Visual Card. It has not been well tested and have quite a few limitations. When you want to apply viewer in Power BI report formally, please use the open source project as mentioned above.
Industry practitioners are seeking more efficient ways to analyze the accumulated data in projects on a daily basis. Microsoft Power BI is one of the most popular and powerful data analysis tools, as it provides intelligent dashboards to inspect data with. Especially in the BIM industry, Power BI is widely adopted as a solution for data inspection and risk anticipation. The below is just a small experiment on how to embed Forge Viewer to web version of Power BI report.
This scenario stems from the requirement that some customers will need to work within Power BI and have not had the chance to program. VCad, a 3rd party partner of Forge, has provided a solution to this requirement. If you would like to use their existing visual, this could be one choice.
From a technology perspective, this solution is a type of Custom Visual of PowerBI. It allows the developer to build the custom visualization, with the flexibility to integrate other web libraries with rich graphics such as D3, JQuery, Esri GIS library, etc. It supports a sandbox mode that you can test locally. If you think it is ready to go, you can also publish the visual to Partner Center (available in AppSource).
The skeleton of the custom visual is the TypeScript class. Most external libraries will be imported locally. Due to the usage of Forge Viewer Javascript libraries, we cannot import the libraries locally. We'll need to define the logic to import Forge Viewer3D.min.js and Style.min.css through the host URL of Forge, like we usually do with Forge app.
private async loadForgeViewerScriptAndStyle(): Promise<void> {
return new Promise<void>((reslove,reject) => {
let forgeviewerjs = document.createElement('script');
forgeviewerjs.src = 'https://developer.api.autodesk.com/modelderivative/v2/viewers/viewer3D.js';
forgeviewerjs.id = 'forgeviewerjs';
document.body.appendChild(forgeviewerjs);
forgeviewerjs.onload = () => {
console.info("Viewer scripts loaded");
let link = document.createElement("link");
link.rel = 'stylesheet';
link.href = 'https://developer.api.autodesk.com/modelderivative/v2/viewers/style.min.css';
link.type = 'text/css';
link.id = "forgeviewercss";
document.body.appendChild(link);
console.info("Viewer CSS loaded");
reslove();
};
forgeviewerjs.onerror = (err) => {
console.info("Viewer scripts error:" +err );
reject(err);
};
})
};Four Pending Investigations on Embedding the Forge Viewer in Power BI Reports
In addition, the visual won't work with Forge Viewer if it is built with the 2.5.0 version of the Pbiviz custom visual tool. Thanks to a hint (about the Pbiviz version) from my colleague Frederic Duszyk in engineering team, I was saved from struggling to make the sample work. Currently, the custom visual by Pbiviz version 2.5.0 works. Here is the Power BI embedded sample with Github.
This sample uses an Excel file as a data source, so one project can generate an Excel file with properties of the model objects (DBLD and materials). The other project is the Power BI custom visual. The Readme describes the steps for this project in detail.
1. As Readme says, the sample uses hard-coded token or call custom endpoint of token. Obviously, in the final visual, you need to get the token dynamically. It is not a safe way to set Access-Control-Allow-Origin.
2. If you're debugging in the browser console, you may find this type of error on Windows OS. I have not figured out where it comes from. It may be because it is a sandbox. It does not affect the model loading in Forge Viewer. And if you're in OSX, the error does not appear.
"Uncaught DOMException: Failed to read the 'sessionStorage' property from 'Window': The document is sandboxed and lacks the 'allow-same-origin' flag."
3. This sample uses a static excel file as a data source. In reality, we would need an SQL database or Push Data. By this, I mean that when any model is loaded, the data source can be dynamically refreshed with the objects properties.
4. In the current sample, the custom visual (with Forge Viewer) responds when the table view or pie view is selected. I am investigating how to make the table view and pie view responding when the objects are selected in Forge Viewer. Stay tuned.
Lastly, I also logged a wish with the Forge Viewer team to expose an official visual in the Power BI partner center. The wish ID is: LMV-5594
If this blog was helpful, check out other coding resources on the Forge Community Blog or Code Samples page.