Power BI矩阵自定义视觉对象选择同步及回调失效问题咨询

我来帮你逐个分析这两个问题的代码问题和解决方案：

问题1：使用withMatrixNode生成Selection ID后其他视觉报错 #

你的代码里有一个关键错误：在循环中重复使用了同一个selectionIdBuilder实例。每次调用withMatrixNode会在现有builder上追加节点信息，导致生成的Selection ID包含了之前所有循环项的层级数据，这不符合Power BI的选择ID规范，其他视觉无法识别这种错误的ID，从而抛出异常。

修正方案： #

在每次遍历矩阵节点时，重新创建一个新的selectionIdBuilder实例，确保每个节点的Selection ID都是独立构建的：

visualTransform(options: VisualUpdateOptions, host: IVisualHost): DataViewModel {
    let dataViews = options.dataViews[0];
    var rows = dataViews.matrix.rows;
    let listSelectionId: DataListSelection[] = [];

    // 不要在外部复用同一个builder，每次循环都新建
    rows.root.children.forEach(x => {
        let selectionIdBuilder = host.createSelectionIdBuilder();
        listSelectionId.push({ 
            value: x.value, 
            selectionId: selectionIdBuilder.withMatrixNode(x, rows.levels).createSelectionId() 
        });

        if (x.children) x.children.forEach(z => {
            let selectionIdBuilder = host.createSelectionIdBuilder();
            listSelectionId.push({ 
                value: z.value, 
                selectionId: selectionIdBuilder.withMatrixNode(z, rows.levels).createSelectionId() 
            });

            if (z.children) z.children.forEach(a => {
                let selectionIdBuilder = host.createSelectionIdBuilder();
                listSelectionId.push({ 
                    value: a.value, 
                    selectionId: selectionIdBuilder.withMatrixNode(a, rows.levels).createSelectionId() 
                });
            })
        })
    });
    return { dataPoints: listSelectionId }
}

问题2：SelectionManager的选择回调未被外部视觉触发 #

你的回调注册逻辑本身没问题，但外部视觉触发选择时，Power BI会通过VisualUpdateOptions的selection属性把选择状态传递给你的视觉，而你的代码没有处理这个传入的选择状态，导致selectionManager的内部状态和外部选择不同步，回调自然不会触发。

修正方案： #

在update方法中，检查并同步外部传入的选择状态到selectionManager，同时确保allowInteractions处于开启状态：

1. 首先在update方法中处理外部选择：

public update(options: VisualUpdateOptions) {
    // 同步外部选择到selectionManager，triggerCallback设为true触发注册的回调
    if (options.selection && this.selectionManager) {
        this.selectionManager.select(options.selection, true);
    }

    // 其他update逻辑...
    let viewModel = this.visualTransform(options, this.host);
    // 渲染视图...
}

2. 构造函数中的逻辑保持正确即可（你已用箭头函数确保this指向正确，补充确认交互权限）：

constructor(options: VisualConstructorOptions) {
    this.host = options.host;
    this.selectionManager = this.host.createSelectionManager();
    console.log('constructor allow interaction', this.host.allowInteractions);
    
    this.selectionManager.registerOnSelectCallback(() => {
        console.log('selection manager callback', this.selectionManager.getSelectionIds());
    });
    
    this.selectionIdBuilder = options.host.createSelectionIdBuilder();
    // 其他初始化逻辑...
}

额外注意点： #

确保你的视觉在capabilities.json中正确配置了选择交互权限，比如：

"supportsSelection": true,
"supportsInteraction": true,
"objects": {
    "general": {
        "displayName": "General",
        "properties": {}
    }
}

内容的提问来源于stack exchange，提问作者saiful haqqi