devnews.pl

Main Menu

  • Informacje
    • Systemy i przeglądarki
    • Gadżety
  • Narzędzia
  • Frontend
  • Backend
  • QA
  • Języki programowania

logo

devnews.pl

  • Informacje
    • Systemy i przeglądarki
    • Gadżety
  • Narzędzia
  • Frontend
  • Backend
  • QA
  • Języki programowania
Narzędzia
Home›Narzędzia›Power BI dla React – analityka biznesowa w React

Power BI dla React – analityka biznesowa w React

By Bernadeta Zapała
23 lipca 2020
177
0
Share:

Przede wszystkim React jest jedną z najpopularniejszych i najnowszych bibliotek JavaScript typu open source. Wielu użytkowników zgłaszało prośbę o ułatwienie integracji biblioteki React oraz aplikacjami internetowymi Power BI. Oczywiście jest to pakiet narzędzi do analizy biznesowej. Dzięki niemu można także monitorować swoją firmę dzięki pulpitom nawigacyjnym. W związku z tym już dziś możemy korzystać z tego narzędzia, dzięki ogłoszonemu wydaniu składnika Power BI dla React.

Działanie komponentu

Ten nowy komponent, obsługujący JS oraz TS, pomaga w ustawieniu analityki w aplikacjach internetowych React. Z pewnością praca staje się łatwiejsza, dzięki korzystaniu z komponentu React do pracy z wbudowaną analizą.

Ta biblioteka dla React pozwoli osadzić raporty, kafelki pulpitów nawigacyjnych, także same pulpity nawigacyjne oraz wizualizować raporty. Z pewnością przez integrację bootstrap osiąga się większą wydajność. Ponadto można ją odpowiednio zoptymalizować. Nowo wydany komponent uprościł także zarządzanie cyklem życia w aplikacjach React.

Power BI dla React

Przykład wdrożenia Power BI w aplikacji React

Aplikacja React osadzająca przykładowy raport przy użyciu komponentu PowerBIEmbed. Przedstawia pełny przepływ od załadowania raportu do osadzania i aktualizowania osadzonego raportu.

  1. Import biblioteki
import { PowerBIEmbed } from 'powerbi-client-react';
  1. Osadzanie raportu w aplikacji internetowej React:
<PowerBIEmbed
    embedConfig = {{
        type: 'report',   // Supported types: report, dashboard, tile, visual and qna
        id: '<ReportId>',
        embedUrl: '<EmbedUrl>',
        accessToken: '<AccessToken>',
        tokenType: models.TokenType.Embed,
        settings: {
            panes: {
                filters: {
                    visible: false
                },
                pageNavigation: {
                    visible: false
                }
            },
        }
    }}
 
    // Define event handlers
    eventHandlers = {
        new Map([
            ['loaded', function () { console.log('Report loaded'); }],
            ['rendered', function () { console.log('Report rendered'); }],
            ['error', function (event) { console.log(event.detail); }]
        ])}
 
    // Add CSS classes to the div element
    cssClassName = { "report-style-class" }
 
    // Get reference to the embedded object
    getEmbeddedComponent = { (embeddedReport) => {
        this.report = embeddedReport as Report;
    }}
/>

Na zakończenie – pełna instrukcja jest dostępna w pliku usługi Power BI. Komponent Power BI jest także dostępny w NPM jako open source w serwisie GitHub.

TagsDeveloperDEVELOPERSPOWER BIPOWER BI DEVELOPERSReact

Share:

  • BuckleScript 8.1
    Języki programowania

    BuckleScript 8.1 – nowa składnia języka oparta na Reason

  • Narzędzia

    Vue Router 4 beta – nowe funkcje oficjalnego routera Vue

  • Narzędzia

    Moment.js przechodzi w tryb utrzymania

  • 3 marca 2021

    Vite 2.0 wydane z nowymi wtyczkami

  • 25 lutego 2021

    ReacType 5.0 – zmiany we wprowadzaniu komponentów

  • 23 lutego 2021

    Dapr v.1.0 gotowy do fazy produkcji

  • 22 lutego 2021

    ReScript 9.0 z zewnętrzną konfiguracją stdlib

  • 22 lutego 2021

    One UI 3.1 z ciekawymi nowościami dla urządzeń Samsunga

  • 22 lutego 2021

    Windows Terminal Preview 1.6 z nową sekcją ustawień

  • 15 lutego 2021

    Visual Studio Code 1.53 z ulepszeniami debugowania

  • 8 lutego 2021

    Edge 89 beta, Edge Dev 90 i nowości na kanale Canary

  • 2 lutego 2021

    Firefox 85 i Firefox Nightly – nowe wersje przeglądarki Mozilli

  • 29 stycznia 2021

    Billboard.js 2.2.0 z nowymi funkcjami wykresów

  • 26 stycznia 2021

    Kendo UI R1 2021 – nowości dla bibliotek

  • 21 stycznia 2021

    Narzędzie Vno – połączenie Vue i Deno

  • 19 stycznia 2021

    GitHub Enterprise Server 3.0 RC – kandydat do wydania

  • 15 stycznia 2021

    TypeScript 4.2 Beta z ulepszeniami typów krotek

  • 13 stycznia 2021

    Styczniowy Patch Tuesday z luką 0-day

  • 11 stycznia 2021

    Safari Technology Preview 118 dostępne dla programistów

  • 8 stycznia 2021

    Microsoft Launcher na Androida z usprawnionym dotykiem

  • 7 stycznia 2021

    WebStorm 2020.3.1 dostępny dla urządzeń z Apple Silicon

  • 22 grudnia 2020

    ReScript 8.4 z przypiętymi zależnościami

  • 14 grudnia 2020

    Edge 88 beta i przeglądarka na kanale Canary dostępne!

  • 9 grudnia 2020

    Chrome 88 Beta z nowościami w WebXR

  • 9 grudnia 2020

    Snowpack 3.0 RC z eksperymentalnymi funkcjami

  • 4 grudnia 2020

    Android Studio Arctic Fox – nowe wydanie narzędzia Google

  • 4 grudnia 2020

    The Hack Summit 2020 – konferencja IT Security

  • 2 grudnia 2020

    PowerToys 0.27 z poprawkami błędów

  • 2 grudnia 2020

    Aleph.js alfa z funkcją importowania map

  • 27 listopada 2020

    Cypress 6.0 zwiększa zakres możliwości obsługi sieci

  • 26 listopada 2020

    Firefox 83 przyspiesza i wprowadza tryb HTTPS-Only

  • 25 listopada 2020

    Electron 11.0 z obsługą Apple Silicon

  • 25 listopada 2020

    Prettier 2.2 z obsługą najnowszego TypeScript 4.1

 

 

Jesteśmy pasjonatami najnowszych technologii w świecie programowania. Zbieramy dla Was informacje i porady z całego świata, które sprawią, że Twoja praca stanie się jeszcze bardziej efektywna.

Obserwuj nas codziennie, aby być na bieżąco oraz śmiało udostępniaj nasze posty.

Zespół DevNews

Kategorie

  • Backend
  • Bez kategorii
  • Frontend
  • Gadżety
  • Informacje
  • Języki programowania
  • Narzędzia
  • QA
  • Systemy i przeglądarki

OBSERWUJ NAS

KONTAKT

Chcesz się z nami skontaktować?

Napisz do nas wiadomość: kontakt@devnews.pl

www.devnews.pl | DEVNEWS 2020 | Newsy i ciekawostki ze świata IT