power bi embedded

Anonymous — Thu, 28 Jan 2021 16:24:15 GMT

Hello all,

I am trying to embed Power BI report into React website.

import { Report } from 'powerbi-report-component';<Report
  tokenType="Embed" // or, "Aad"
  accessToken="" // accessToken goes here
  embedUrl="" // embedUrl goes here
  embedId="" // report or dashboard Id goes here
  pageName="" // set as current page of the report
  reportMode="view" // options: view/edit/create
  permissions="All" // View
/>

This is my code for it. But when I view this in the browser, report size is too small. What should I do to make report display in larger size?

Thanks

Re: power bi embedded

Icey — Mon, 01 Feb 2021 06:24:30 GMT

Hi Anonymous ,

Try to modify the following code to meet your requirements:

// Get a reference to the embedded report HTML element var embedContainer = $('#embedContainer')[0]; // Get models. models contains enums that can be used. var models = window['powerbi-client'].models; // Define default visual layout: visible in 400x300. let defaultLayout = { width: 400, height: 250, displayState: { mode: models.VisualContainerDisplayMode.Hidden } }; // Define page size as custom size: 1000x580. let pageSize = { type: models.PageSizeType.Custom, width: 1000, height: 580 }; // Page layout: two visible visuals in fixed position. let pageLayout = { defaultLayout: defaultLayout, visualsLayout: { "VisualContainer1": { x: 70, y: 100, displayState: { mode: models.VisualContainerDisplayMode.Visible } }, "VisualContainer3": { x: 540, y: 100, displayState: { mode: models.VisualContainerDisplayMode.Visible } } } }; let settings = { layoutType: models.LayoutType.Custom, customLayout: { pageSize: pageSize, displayOption: models.DisplayOption.FitToPage, pagesLayout: { "ReportSection600dd9293d71ade01765": pageLayout } }, panes: { filters: { visible: false }, pageNavigation: { visible: false } } } // Get a reference to the embedded report. report = powerbi.get(embedContainer); // Update the settings by passing in the new settings you have configured. try { await report.updateSettings(settings); Log.logText("Custom layout applied, to remove custom layout, reload the report using 'Reload' API."); } catch (error) { Log.log(error); }

Reference: Power BI Embedded custom layout | Azure updates | Microsoft Azure

Best regards

Icey

If this post helps, then consider Accepting it as the solution to help other members find it faster.

topic Re: power bi embedded in Report Server

power bi embedded

Re: power bi embedded