Sort legend (#16)

* Sort category legends by Sort field * Fix Series sorting/percent labels properties. * Check data to category gradient support
microsoft · Jan 23, 2018 · 75189d7 · 75189d7
1 parent 943ab2a
commit 75189d7
Show file tree

Hide file tree

Showing 7 changed files with 30 additions and 13 deletions.
diff --git a/changelog.md b/changelog.md
@@ -1,3 +1,8 @@
+## 1.9.4
+
+* Legend category sorts by category sort datafield
+* Fix sort series properties
+
 ## 1.9.3
 
 * Displaying the legend with specific dataset breaks the visual - fixed
@@ -28,4 +33,5 @@ The options available only when each value belongs to only one category
 * Sort legend each category items by value
 
 ## 1.8.1
+
 * Fix for bug - X-axis label hided incorrectly
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "powerbi-visuals-mekkochart",
-  "version": "1.9.3",
+  "version": "1.9.4",
   "description": "A Mekko chart is a mix of a 100% stacked column chart and a 100% stacked bar chart combined into one view. Similar to a treemap, the dimensional values are represented by length and width of each rectangle. The width of a column is proportional to the total value of the column.",
   "repository": {
     "type": "git",

diff --git a/pbiviz.json b/pbiviz.json
@@ -1,10 +1,10 @@
 {
   "visual": {
     "name": "MekkoChart",
-    "displayName": "Mekko Chart 1.9.3",
+    "displayName": "Mekko Chart 1.9.4",
     "guid": "MekkoChart1449744733038",
     "visualClassName": "MekkoChart",
-    "version": "1.9.3",
+    "version": "1.9.4",
     "description": "A Mekko chart is a mix of a 100% stacked column chart and a 100% stacked bar chart combined into one view. Similar to a treemap, the dimensional values are represented by length and width of each rectangle. The width of a column is proportional to the total value of the column.",
     "supportUrl": "http://community.powerbi.com",
     "gitHubUrl": "https://github.com/Microsoft/powerbi-visuals-mekkochart"

diff --git a/src/columnChart/baseColumnChart.ts b/src/columnChart/baseColumnChart.ts
@@ -1200,6 +1200,10 @@ module powerbi.extensibility.visual.columnChart {
                     this.enumerateSortLegend(enumeration);
                     break;
                 }
+                case "sortSeries": {
+                    this.enumerateSortSeries(enumeration);
+                    break;
+                }
                 case "categoryColorStart": {
                     this.enumerateCategoryColors(enumeration, "categoryColorStart", "Start color");
                     break;
@@ -1212,7 +1216,7 @@ module powerbi.extensibility.visual.columnChart {
         }
 
         private enumerateCategoryColors(instances: VisualObjectInstance[], objectName: string, label: string) {
-            if (this.data.dataPointSettings && this.data.dataPointSettings.categoryGradient) {
+            if (this.data.dataPointSettings && this.data.dataPointSettings.categoryGradient && this.checkDataToFeatures()) {
                 this.data.categories.forEach( (category, index ) => {
                     let categoryLegends: MekkoLegendDataPoint[] = this.data.legendData.dataPoints.filter( legend => legend.category === category);
 
@@ -1339,13 +1343,15 @@ module powerbi.extensibility.visual.columnChart {
             }
 
             let properties: any = {};
-            properties["categoryGradient"] = this.data.dataPointSettings.categoryGradient;
+            if (this.checkDataToFeatures()) {
+                properties["categoryGradient"] = this.data.dataPointSettings.categoryGradient;
 
-            instances.push({
-                objectName: "dataPoint",
-                selector: null,
-                properties: properties
-            });
+                instances.push({
+                    objectName: "dataPoint",
+                    selector: null,
+                    properties: properties
+                });
+            }
 
             if (data.hasDynamicSeries || seriesCount > 1 || !data.categoryMetadata) {
                 if (!this.data.dataPointSettings.categoryGradient) {

diff --git a/src/converterStrategy/baseConverterStrategy.ts b/src/converterStrategy/baseConverterStrategy.ts
@@ -247,7 +247,8 @@ module powerbi.extensibility.visual.converterStrategy {
                             category: category,
                             categoryStartColor: categoryGradientBaseColorIdentities[categoryIndex].categoryStartColor,
                             categoryEndColor: categoryGradientBaseColorIdentities[categoryIndex].categoryEndColor,
-                            categoryIdentity: categoryGradientBaseColorIdentities[categoryIndex].categorySelectionId
+                            categoryIdentity: categoryGradientBaseColorIdentities[categoryIndex].categorySelectionId,
+                            categorySort: this.dataView.categories[categoryFieldIndex].values[categoryIndex]
                         });
 
                         if (series.identity && source.groupName !== undefined) {

diff --git a/src/dataIntrefaces.ts b/src/dataIntrefaces.ts
@@ -80,6 +80,7 @@ module powerbi.extensibility.visual {
         index: number;
         data: MekkoLegendDataPoint[];
         dataValues: number;
+        categorySorting: PrimitiveValue;
     }
 
     export interface ILegendGroup extends ILegend {
@@ -394,6 +395,7 @@ module powerbi.extensibility.visual {
         fontSize?: number;
         valueSum?: number;
         categoryValues?: PrimitiveValue[];
+        categorySort?: PrimitiveValue;
         categoryIdentity?: powerbi.data.Selector;
         categoryStartColor?: string;
         categoryEndColor?: string;

diff --git a/src/visual.ts b/src/visual.ts
@@ -1504,7 +1504,8 @@ module powerbi.extensibility.visual {
                             category: this.layers[0].getData().categories[element.categoryIndex],
                             index: element.categoryIndex,
                             data: [],
-                            dataValues: 0
+                            dataValues: 0,
+                            categorySorting: null
                         };
                         reducedLegends[element.categoryIndex].data.push(element.data);
                     });
@@ -1522,7 +1523,7 @@ module powerbi.extensibility.visual {
                         }
                     });
 
-                    reducedLegends = _.sortBy(reducedLegends, "dataValues");
+                    reducedLegends = _.sortBy(reducedLegends, "categorySort");
 
                     if (legendSortSettings.direction === MekkoChart.SortDirectionDescending) {
                         reducedLegends = reducedLegends.reverse();
@@ -2397,6 +2398,7 @@ module powerbi.extensibility.visual {
                 }
 
                 let forceDisplay: boolean = (<MekkoChartLabelSettings>(<MekkoColumnChartData>layers[0].getData()).labelSettings).forceDisplay;
+
                 drawDefaultLabelsForDataPointChart(
                     resultsLabelDataPoints,
                     this.labelGraphicsContextScrollable,