在 Power BI 自定义视觉对象中使用分类数据视图映射创建分层数据结构

如何解决在 Power BI 自定义视觉对象中使用分类数据视图映射创建分层数据结构

我正在尝试为分类数据映射 here 重现 Power BI 视觉对象文档中的示例 6。文档说这个例子应该产生一个 Country => Year => Value 的层次结构，但我正在努力让它按年分组。

视觉效果的预期结果是：

{
    "Canada": {
        "2014": [
            630
        ],"2015": [
            490
        ]
    },"USA": {
        "2015": [
            650
        ],"2016": [
            350
        ]
    },"UK": {
        "2015": [
            831
        ]
    },"Mexico": {
        "2013": [
            645
        ]
    }
}

我明白了：

{
    "Canada": {
        "undefined": [
            1120
        ]
    },"USA": {
        "undefined": [
            1000
        ]
    },"UK": {
        "undefined": [
            831
        ]
    },"Mexico": {
        "undefined": [
            645
        ]
    }
}

我使用的所有代码都直接取自示例代码，除了添加了几个导入语句。

这是我的visual.ts：

"use strict";

import "core-js/stable";
import "./../style/visual.less";
import powerbi from "powerbi-visuals-api";
import VisualConstructorOptions = powerbi.extensibility.visual.VisualConstructorOptions;
import VisualUpdateOptions = powerbi.extensibility.visual.VisualUpdateOptions;
import IVisual = powerbi.extensibility.visual.IVisual;
import EnumerateVisualObjectInstancesOptions = powerbi.EnumerateVisualObjectInstancesOptions;
import VisualObjectInstance = powerbi.VisualObjectInstance;
import DataView = powerbi.DataView;
import VisualObjectInstanceEnumerationObject = powerbi.VisualObjectInstanceEnumerationObject;

import { VisualSettings } from "./settings";
import IVisualHost = powerbi.extensibility.visual.IVisualHost;
import DataViewCategorical = powerbi.DataViewCategorical;
import DataViewValueColumnGroup = powerbi.DataViewValueColumnGroup;
import PrimitiveValue = powerbi.PrimitiveValue;
import DataViewCategoryColumn = powerbi.DataViewCategoryColumn
// standart imports
// ...

export class Visual implements IVisual {
    private target: HTMLElement;
    private host: IVisualHost;
    private categories: HTMLElement;

    constructor(options: VisualConstructorOptions) {
        // constructor body
        this.target = options.element;
        this.host = options.host;
        this.categories = document.createElement("pre");
        this.target.appendChild(this.categories);
        // ...
    }

    public update(options: VisualUpdateOptions) {
        const dataView: DataView = options.dataViews[0];
        const categoricalDataView: DataViewCategorical = dataView.categorical;

        if (!categoricalDataView ||
            !categoricalDataView.categories ||
            !categoricalDataView.categories[0] ||
            !categoricalDataView.values) {
            return;
        }


        // Categories have only one column in data buckets
        // If you want to support several columns of categories data bucket,you should iterate categoricalDataView.categories array.
      let categoryFieldIndex = 0;

        // Measure has only one column in data buckets.
        // If you want to support several columns on data bucket,you should iterate years.values array in map function
        const measureFieldIndex = 0;
        let categories: PrimitiveValue[] = categoricalDataView.categories[categoryFieldIndex].values;
        
        let values: DataViewValueColumnGroup[] = categoricalDataView.values.grouped();

        let data = {};
        // iterate categories/countries
        categories.map((category: PrimitiveValue,categoryIndex: number) => {
            data[category.toString()] = {};
            // iterate series/years
            values.map((years: DataViewValueColumnGroup) => {
                if (!data[category.toString()][years.name] && years.values[measureFieldIndex].values[categoryIndex]) {
                    data[category.toString()][years.name] = []
                }
                if (years.values[0].values[categoryIndex]) {
                    data[category.toString()][years.name].push(years.values[measureFieldIndex].values[categoryIndex]);
                }
            });
        });

        this.categories.innerText = JSON.stringify(data,null,6);
        console.log(data);
    }
}

这是我的 capabilities.json：

{
"dataRoles": [
    {
        "displayName": "Categories","name": "category","kind": "Grouping"
    },{
        "displayName": "Measures","name": "measure","kind": "Measure"
    },{
        "displayName": "Series","name": "series","kind": "Measure"
    }
],"dataViewMappings": [
    {
        "categorical": {
            "categories": {
                "for": {
                    "in": "category"
                }
            },"values": {
                "group": {
                    "by": "series","select": [{
                            "for": {
                                "in": "measure"
                            }
                        }
                    ]
                }
            }
        }
    }
]
}

老实说，我不知道我做错了什么，如果有任何关于问题出在哪里的帮助/指导，我将不胜感激。