PowerBI Embed for React Native
This component opens embeded PowerBI reports. It uses the WebView on Android and the WKWebView on iOS the display them.
Installation
$ npm install --save react-native-powerbi
The solution depends on react-native-wkwebview-reborn for iOS, please refer to them if you have any troubles on iOS with linkink.
Usage
import PowerBIEmbed from 'react-native-powerbi';
For a report to display you need at least three parts: AccessToken, Embed URL and the ID of the report. (these can be obtained thru the rest api)
<PowerBIEmbed accessToken="H4sIAAAAAAAEACVW...NH8v_8HNiWyTi4LAAA=" embedUrl="https://app.powerbi.com/reportEmbed?reportId=bac25fa7-d58d-40b6-8b01-606d165c3b43&groupId=be8908da-da25-452e-b220-163f52476cdd" id="bac25fa7-d58d-40b6-8b01-606d165c3b43"/>
Language
You can also pass the language the report must use
<PowerBIEmbed accessToken="H4sIAAAAAAAEACVW...NH8v_8HNiWyTi4LAAA=" embedUrl="https://app.powerbi.com/reportEmbed?reportId=bac25fa7-d58d-40b6-8b01-606d165c3b43&groupId=be8908da-da25-452e-b220-163f52476cdd" id="bac25fa7-d58d-40b6-8b01-606d165c3b43" language="en"/>
Embed configuration
You can pass your own configuration object from the PowerBI JS library
const config = type: 'report' tokenType: 1 accessToken: "H4sIAAAAAAAEACVW...NH8v_8HNiWyTi4LAAA=" embedUrl: "https://app.powerbi.com/reportEmbed?reportId=bac25fa7-d58d-40b6-8b01-606d165c3b43&groupId=be8908da-da25-452e-b220-163f52476cdd" id: "bac25fa7-d58d-40b6-8b01-606d165c3b43" settings: filterPaneEnabled: false navContentPaneEnabled: true <PowerBIEmbed embedConfiguration=config />
Roadmap / todo
- More layout options
- Event communication from PowerBI to component