Del via


Rullegardinformateringssektorer

rullegardinmeny sektor er en enkel formateringssnitt som brukes til å representere opplisting objekttype fra capabilities.json fil. Det finnes to rullegardinmenyer – ItemDropdown- og AutoDropdown.

Forskjellen er at for AutoDropdown-slicen må du deklarere listen over opplistingselementer under det aktuelle objektet i capabilities.json-filen, og for ItemDropdown-sektoren i klassen for formateringsinnstillinger.

Eksempel: Implementering av rullegardinmeny

I dette eksemplet viser vi hvordan du bygger en rullegardinliste ved hjelp av formateringsmodellverktøy. Følgende faner viser eksempler på ItemDropdown og AutoDropdown slicer.

skjermbilde av en ItemDropdown.

Egenskapsobjekt

Sett inn følgende JSON-fragment i capabilities.json-filen.

{
  // ... same level as dataRoles and dataViewMappings
  "objects": {
    "labels": {
      "properties": {
        "option": {
          "type": {
            "enumeration": []
          }
        },
      }
    }
  }
}

Formateringsmodellklasse

Sett inn følgende kodefragment i innstillingsfilen.

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

const positionOptions : powerbi.IEnumMember[] = [
    {value : "top", displayName : "Top"}, 
    {value : "bottom", displayName : "Bottom"},
    {value : "left", displayName : "Left"}, 
    {value : "right", displayName : "Right"}
];

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

    public option: formattingSettings.ItemDropdown = new formattingSettings.ItemDropdown({
        name: "option", // same as capabilities property name
        displayName: "Option",
        items: positionOptions,
        value: positionOptions[0] 
    });

    public slices: formattingSettings.Slice[] = [ this.option ];
}

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