Register now to learn Fabric in free live sessions led by the best Microsoft experts. From Apr 16 to May 9, in English and Spanish.
Good evening,
I'm relatively new to Power BI and want to create a filter for my data in my custom visual so my data will be updated in every other visual/slicer on the same page. Right now I have this d3 graph with a click event on an edge which gives me an array of slection ids. These ids I am passing to the selectionManager and select them. The result is highlighted data in every other visual, but how can i create a filter out of this selection (like a filter I get from a slicer).
Code (summarized)
capabilities.json:
"dataRoles": [ { "displayName": "Aktivität", "name": "activity", "kind": "Grouping" }, { "displayName": "Aktivitäts-ID", "name": "activityid", "kind": "Grouping" }, { "displayName": "Fall-ID", "name": "caseid", "kind": "Grouping" }, { "displayName": "Variante", "name": "path", "kind": "Grouping" }, { "displayName": "Zeitstempel", "name": "timestamp", "kind": "Grouping" } ], "dataViewMappings": [ { "table":{ "rows": { "select": [ { "for": { "in": "caseid"} }, { "for": { "in": "activity"} }, { "for": { "in": "activityid"} }, { "for": { "in": "path"} }, { "for": { "in": "timestamp"} } ], "dataReductionAlgorithm": { "top": { "count": 500000 } } } } } ],
visual.ts:
interface EventLogdata { activityid: any, activity: string, caseid: any, path: string, timestamp: any, selectionID: ISelectionId; } ------------------------------------------ function getSelectionIds(dataView: DataView, host: IVisualHost): ISelectionId[] { return dataView.table.identity.map((identity: DataViewScopeIdentity) => { const categoryColumn: DataViewCategoryColumn = { source: dataView.table.columns[1], values: null, identity: [identity] }; return host.createSelectionIdBuilder() .withCategory(categoryColumn, 0) .createSelectionId(); }); } ------------------------------------------- function visualTransform(options: VisualUpdateOptions, host: IVisualHost): FlowchartViewModel { ... ... let tableSelectionId: ISelectionId[] = getSelectionIds(dataViews[0],host); ... ... for (let i = 0; i < rows.length; i++) { eventlogData.push({ activityid: rows[i][index_activityid], activity: <string>rows[i][index_activity], caseid: rows[i][index_caseid], path: <string>rows[i][index_path], timestamp: valueFormatterUK.format(rows[i][index_timestamp]), selectionID: tableSelectionId[i], }); } ------------------------------ public update(options: VisualUpdateOptions, edge) { d3.selectAll("g.edgePath, .edgeLabel").on("click", function(e) { let selectionIdArray = PSEUDO: this is my array with the selected selection ids selectionManager.select(selectionIdArray, true); } }); }
Solved! Go to Solution.
Hello @Anonymous,
At first you should add the filter option into capabilities.json:
"objects": { "general": { "displayName": "General", "properties": { "filter": { "type": { "filter": true } } } } }
As a final step you should call selectionManager.applySelectionFilter() after calling selectionManager.select.
Could you please apply the necessary changes to your code base and let us know if that works well?
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
Hello @Anonymous,
At first you should add the filter option into capabilities.json:
"objects": { "general": { "displayName": "General", "properties": { "filter": { "type": { "filter": true } } } } }
As a final step you should call selectionManager.applySelectionFilter() after calling selectionManager.select.
Could you please apply the necessary changes to your code base and let us know if that works well?
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
Covering the world! 9:00-10:30 AM Sydney, 4:00-5:30 PM CET (Paris/Berlin), 7:00-8:30 PM Mexico City
Check out the April 2024 Power BI update to learn about new features.
User | Count |
---|---|
16 | |
2 | |
2 | |
1 | |
1 |