Del via


Slå formateringsudsnit til/fra

ToggleSwitch er et simpelt formateringsudsnit, der bruges til at repræsentere bool- objekttype fra capabilities.json fil.

Skærmbillede af udsnittet ToggleSwitch.

Eksempel: ToggleSwitch-implementering

I dette eksempel viser vi, hvordan du opretter et ToggleSwitch udsnit ved hjælp af formateringsmodelhjælpeprogrammer.

Objektet Capabilities

Indsæt følgende JSON-fragment i filen capabilities.json.

{
  // ... same level as dataRoles and dataViewMappings
  "objects": {
    "labels": {
      "properties": {
        "show": {
          "type": {
            "bool": true
          }
        }
      }
    }
  }
}

Formateringsmodelklasse

Indsæt følgende kodefragment i indstillingsfilen.

import { formattingSettings } from "powerbi-visuals-utils-formattingmodel";

class LabelsCardSetting extends formattingSettings.SimpleCard {
    name: string = "labels"; // same as capabilities object name
    displayName: string = "Labels";

    public showLabels: formattingSettings.ToggleSwitch = new formattingSettings.ToggleSwitch({
        name: "show", // same as capabilities property name
        displayName: "Show",
        value: true
    });
    
    public slices: formattingSettings.Slice[] = [ this.showLabels ];
}

export class VisualSettings extends formattingSettings.Model {
    public labels: LabelsCardSetting = new LabelsCardSetting();
    public cards: formattingSettings.SimpleCard[] = [this.labels];
}

Flere indstillinger

Udsnittet ToggleSwitch kan også bruges som et kortskift på øverste niveau.

Skærmbillede af udsnittet ToggleSwitch på øverste niveau.

Hvis du vil gøre ToggleSwitch til det øverste niveau, skal du fjerne udsnittet fra de udsnit matrix og føje følgende linje til klassen kortindstillinger:

topLevelSlice: formattingSettings.ToggleSwitch = this.showLabels;

Den endelige fil med formateringsindstillinger skal stemme overens med dette eksempel:

import { formattingSettings } from "powerbi-visuals-utils-formattingmodel";

class LabelsCardSetting extends formattingSettings.SimpleCard {
    name: string = "labels"; // same as capabilities object name
    displayName: string = "Labels";

    public showLabels: formattingSettings.ToggleSwitch = new formattingSettings.ToggleSwitch({
        name: "show", // same as capabilities property name
        displayName: "Show",
        value: true
    });
    
    topLevelSlice: formattingSettings.ToggleSwitch = this.showLabels;
    public slices: formattingSettings.Slice[] = [];
}

export class VisualSettings extends formattingSettings.Model {
    public labels: LabelsCardSetting = new LabelsCardSetting();
    public cards: formattingSettings.SimpleCard[] = [this.labels];
}