Forum Discussion

satishr's avatar
satishr
Helper III
8 years ago
Solved

Field order change issue when using options.dataViews[0].table.rows in my custom visual

Hi guys,

I have created a simple custom visual widget where I'm using options.dataViews[0].table.rows to get data. The visual takes 3 fields as input - Actual, Target and Category. It works fine when I input fields one by one to the widget but breaks if I input the data in different order even though I'm dragging the fields into correct input positions. It also breaks if I change the fields after creating the visual on the report. I think the issue is because I'm using row[0], row[1].... to get the data. Is there a way to get data as row[actual], row[target].. or can I solve this problem in any other way? 

Need Help
  • v-viig's avatar
    v-viig
    8 years ago

    Please use this code snippet to parse values from table mapping:

     

        export interface ColumnGroup {
        [columnName: string]: number | Date | string;
    }

    function getColumnGroupByRole(
        columns: DataViewMetadataColumn[],
        row: DataViewTableRow
    ): ColumnGroup {
        const columnGroup: ColumnGroup = {};

        row.forEach((value: any, valueIndex: number) => {
            const column: DataViewMetadataColumn = columns[valueIndex];

            Object.keys(columns[valueIndex].roles)
                .forEach((roleName: string) => {
                    columnGroup[roleName] = value;
                });
        });

        return columnGroup;
    }

    function parseData(dataView: DataView) {
        const data: any[] = [];

        dataView.table.rows.forEach((row: DataViewTableRow) => {
            const columns = getColumnGroupByRole(dataView.metadata.columns, row);

            data.push({
                Indicator: +columns["Indicator"],
                Target: +columns["Target"],
                Date: columns["Date"]
                    ? columns["Date"].toString()
                    : null
            });
        });

        return data;
    }

    Ignat Vilesov,

    Software Engineer

     

    Microsoft Power BI Custom Visuals

    [email protected]

3 Replies

    • satishr's avatar
      satishr
      Helper III
      8 years ago

      Hi v-viig, I'm using the below code to fetch data. Can you let me know how to use roles object here? Sorry, I'm new to JSON structures.

       

      for (var i = 0; i < rows.length; i++) {
      var row = rows[i];
      resultData.push({
      Indicator: +row[0],
      Target: +row[1],
      Date: row[2].toString(),
      });

      }
      • v-viig's avatar
        v-viig
        Community Champion
        8 years ago

        Please use this code snippet to parse values from table mapping:

         

            export interface ColumnGroup {
        [columnName: string]: number | Date | string;
    }

    function getColumnGroupByRole(
        columns: DataViewMetadataColumn[],
        row: DataViewTableRow
    ): ColumnGroup {
        const columnGroup: ColumnGroup = {};

        row.forEach((value: any, valueIndex: number) => {
            const column: DataViewMetadataColumn = columns[valueIndex];

            Object.keys(columns[valueIndex].roles)
                .forEach((roleName: string) => {
                    columnGroup[roleName] = value;
                });
        });

        return columnGroup;
    }

    function parseData(dataView: DataView) {
        const data: any[] = [];

        dataView.table.rows.forEach((row: DataViewTableRow) => {
            const columns = getColumnGroupByRole(dataView.metadata.columns, row);

            data.push({
                Indicator: +columns["Indicator"],
                Target: +columns["Target"],
                Date: columns["Date"]
                    ? columns["Date"].toString()
                    : null
            });
        });

        return data;
    }

        Ignat Vilesov,

        Software Engineer

         

        Microsoft Power BI Custom Visuals

        [email protected]