cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Frequent Visitor

Custom Visualization additional DataViewCategoryColumn

Hello,

 

I'm trying to develop a custom visual that replicates an arc chart for every existing category. I've used the code at https://github.com/kiewic/PowerBI-WaffleChart and I'm on the right path:

However, I'm unable to configure a DataViewCategoryColumn for the second level of categories (The slices of the arc chart). 

 

In the current code, I can set up the first categories: 

 

 

 public static converter(dataView: DataView): PieChartViewModel {
            var labelsArray: Array<string> = [];
            var arcsArray: Array<string> = [];
            var Arcs: DataViewCategoryColumn;
            var category0: DataViewCategoryColumn;
            //matrix.columns.root.children
            if (dataView.categorical.categories && dataView.categorical.categories.length > 0) {
                let categories = dataView.categorical.categories;
                category0 = categories[0];
                
                var rowsCount = category0.values.length;
                labelsArray = [];
                arcsArray = [];
                for (let i = 0; i < rowsCount; i++) {
                    let labelPieces: Array<string> = [];
                    for (let j = 0; j < categories.length; j++) {
                        labelPieces.push(this.formatCategoryValue(categories[j].values[i], categories[j].source.type));
                    }
                    labelsArray.push(labelPieces.join("|"));
                }
                var sliceCount = dataView.categorical.values.grouped();
                //.values["0"].__proto__.source.groupName
                for(let j=0; j<sliceCount.length; j++){
                    console.log(sliceCount[j].values[0]["__proto__"].source.groupName);
                    arcsArray.push(this.formatCategoryValue(sliceCount[j].values[0]["__proto__"].source.groupName, sliceCount[j].values[0]["__proto__"].source.type));
                }
           }

 

 

 

However, I'm unable to find a node from which I could set up a similar object for the second dimension of categories. I could create a new array but I believe I need to use the right object type and I'm struggling to do so.

 

Currently, my dataViewMappings look like this:

   cappabilities.json

 

"dataViewMappings": [
        {
            "conditions": [
                {
                    "Category": {
                        "min": 0,
                        "max": 3
                    },
                    "Paths": {
                        "min": 0,
                        "max": 1
                    },
                    "Values": {
                        "min": 0,
                        "max": 1
                    },
                    "Measure": {
                        "min": 0,
                        "max": 1
                    }
                }
            ],
            "categorical": {
                "categories": {
                    "for": { 
                        "in": "Category"
                    },
                    "dataReductionAlgorithm": { 
                        "top": {}
                    }
                },
                "values": {
                    "group": {
                        "by": "Paths",
                        "select":[
                            {
                               "for":{
                                  "in":"Values"
                               }
                            }
                         ], 
                        "dataReductionAlgorithm": {
                            "top": {}
                        }
                    }
                }
            }
        }

Could you please give me a clue?

Thanks a lot in advance!
Guillermo

 

13 REPLIES 13

No, i'm still stuck. 

Here is how it looks now:

https://gist.github.com/sineline/f4f4074919777079d59cbf7551bc1d47

 

 

Community Champion
Community Champion

You should use group-by Category to group values. In such case you will be able to generate a proper SelectionId.

 

"values": {
    "group": {
        "by": "Paths",
        "select":[

Please have a look at this example.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

I believe this is how I've got it right now, with the group by (See gist in previous post).

With it I get the right values, but I want to enumerate and set colors per group (Which are the pie slices).

 

Can I build the selectors the same way when enumerating the different series? (For the pie slices coloring)

 

For the moment, I've been playing with this function.. but i dont know if I'm in the right path:

 

 

case "stackColorsFormatting":
 	var metadataColumns2: DataViewMetadataColumn[] = this.dataView.metadata.columns.filter( function(d) { if (d.groupName) { return true; } } );
	for (let barDataPoint of metadataColumns2) {
	 console.log("create selection id?");
	 objectEnumeration.push({
	   objectName: objectName,
	   displayName:   barDataPoint.groupName.toString(),
	   properties: {
		 fill:this.getArcColor<object>(barDataPoint.objects,objectName,"fill",null)
	   },
	   selector: { id: this.host.createSelectionIdBuilder().withSeries( this.dataView.categorical.values,this.dataView.categorical.values[0] ).createSelectionId().getKey() }
	   
	 });
   }
   break;

 

Community Champion
Community Champion

@GGimenez Could you please share source code to make some changes?

 

You can send code to pbicvsupport@microsoft.com.

 

Ignat Vilesov,

Software Engineer

 

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

Helpful resources

Announcements
November Update

Check it Out!

Click here to read more about the November 2020 Updates!

Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

secondImage

Power Platform October Community Highlights

Check out the top community contributors across all of the communities

secondImage

Create an end-to-end data and analytics solution

Learn how Power BI works with the latest Azure data and analytics innovations at the digital event with Microsoft CEO Satya Nadella.