Embed your PowerBI Dashboard to a NextJS App
npm install nextjs-powerbijsx
import React, { Component } from "react";
import PowerbiEmbedded from "nextjs-powerbi";
class App extends Component {
render() {
return (
id={${YOUR_REPORT_ID}} // required
embedUrl={${YOUR_EMBED_URL}} // required
accessToken={${YOUR_EMBED_TOKEN}} // required
filterPaneEnabled={false}
navContentPaneEnabled={false}
pageName={${YOUR_PAGE_ID}}
embedType={${EMBED_TYPE}}
tokenType={${TOKEN_TYPE}}
permissions={${PERMISSIONS}}
settings={
{
// any settings including localeSettings
}
}
width="600px"
height="900px"
/>
);
}
}
export default App;
`
#### Mobile Optimization
You only need to add mobile prop as boolean.
That set a configuration { layoutType: models.LayoutType.MobilePortrait }.
Check this reference
#### Embed Type
The embed type variable allows you to pass in the requested PowerBI "Type", be that a report, dashboard or tile. See reference. By default, report` is selected.