Κοινή χρήση μέσω


Προσθήκη σελίδας προορισμού στην απεικόνιση Power BI

Η σελίδα προορισμού μιας απεικόνισης Power BI μπορεί να εμφανίσει πληροφορίες στην κάρτα απεικόνισης Power BI, προτού η κάρτα λάβει δεδομένα. Μπορεί να εμφανιστεί η σελίδα προορισμού μιας απεικόνισης:

  • Κείμενο που εξηγεί τον τρόπο χρήσης της απεικόνισης.
  • Μια σύνδεση προς την τοποθεσία web σας.
  • Μια σύνδεση προς ένα βίντεο.

Screenshot of a Power BI visual's example landing page.

Αυτό το άρθρο εξηγεί πώς μπορείτε να σχεδιάσετε μια σελίδα προορισμού για την απεικόνισή σας. Η σελίδα προορισμού εμφανίζεται κάθε φορά που η απεικόνιση δεν έχει δεδομένα σε αυτήν.

Σημείωμα

Η σχεδίαση μιας σελίδας προορισμού απεικόνισης Power BI υποστηρίζεται στην έκδοση API 2.3.0 και νεότερες εκδόσεις. Για να μάθετε ποια έκδοση χρησιμοποιείτε, ελέγξτε το apiVersion στο αρχείο pbiviz.json .

Δημιουργία σελίδας προορισμού

Για να δημιουργήσετε μια σελίδα προορισμού, πρέπει να οριστούν δύο δυνατότητες στο capabilities.json αρχείο.

  • Για να λειτουργήσει η σελίδα προορισμού, ενεργοποιήστε supportsLandingPageτο .
  • Για να εμφανίζεται η σελίδα προορισμού σε λειτουργία προβολής ή η απεικόνιση να είναι αλληλεπιδραστική ακόμα και όταν δεν βρίσκεται σε λειτουργία ρόλων δεδομένων, ενεργοποιήστε supportsEmptyDataViewτο .
    {
        "supportsLandingPage": true,
        "supportsEmptyDataView": true,
    }

Παράδειγμα απεικόνισης με σελίδα προορισμού

Ο παρακάτω κώδικας δείχνει πώς μπορεί να προστεθεί μια σελίδα προορισμού σε μια απεικόνιση γραφήματος ράβδων.

export class BarChart implements IVisual {
    //...
    private element: HTMLElement;
    private isLandingPageOn: boolean;
    private LandingPageRemoved: boolean;
    private LandingPage: d3.Selection<any>;

    constructor(options: VisualConstructorOptions) {
            //...
            this.element = options.element;
            //...
    }

    public update(options: VisualUpdateOptions) {
    //...
        this.HandleLandingPage(options);
    }

    private HandleLandingPage(options: VisualUpdateOptions) {
        if(!options.dataViews || !options.dataViews[0]?.metadata?.columns?.length){
            if(!this.isLandingPageOn) {
                this.isLandingPageOn = true;
                const SampleLandingPage: Element = this.createSampleLandingPage(); //create a landing page
                this.element.appendChild(SampleLandingPage);
                this.LandingPage = d3.select(SampleLandingPage);
            }

        } else {
                if(this.isLandingPageOn && !this.LandingPageRemoved){
                    this.LandingPageRemoved = true;
                    this.LandingPage.remove();
                }
        }
    }