creating colorPalette and adding color to visual

src/barChart.ts

@@ -16,15 +16,17 @@ module powerbi.extensibility.visual {
      *
      * @interface
      * @property {number} value    - Data value for point.
-     * @property {string} category - Coresponding category of data value.
+     * @property {string} category - Corresponding category of data value.
+     * @property {string} color    - Color corresponding to data point.
      */
     interface BarChartDataPoint {
         value: number;
         category: string;
+        color: string;
     };
 
     /**
-     * Function that converts queried data into a view model that will be used by the visual
+     * Function that converts queried data into a view model that will be used by the visual.
      *
      * @function
      * @param {VisualUpdateOptions} options - Contains references to the size of the container
@@ -54,10 +56,12 @@ module powerbi.extensibility.visual {
         let barChartDataPoints: BarChartDataPoint[] = [];
         let dataMax: number;
 
+        let colorPalette: IColorPalette = createColorPalette(host.colors).reset();
         for (let i = 0, len = Math.max(category.values.length, dataValue.values.length); i < len; i++) {
             barChartDataPoints.push({
                 category: category.values[i],
-                value: dataValue.values[i]
+                value: dataValue.values[i],
+                color: colorPalette.getColor(category.values[i]).value
             });
         }
         dataMax = <number>dataValue.maxLocal;
@@ -132,7 +136,8 @@ module powerbi.extensibility.visual {
                 width: xScale.rangeBand(),
                 height: d => height - yScale(d.value),
                 y: d => yScale(d.value),
-                x: d => xScale(d.category)
+                x: d => xScale(d.category),
+                fill: d => d.color,
             });
 
             bars.exit()

src/colorPalette.ts

@@ -0,0 +1,94 @@
+module powerbi.extensibility.visual {
+    /**
+     * Interface for Palette of colors.
+     *
+     * @interface
+     * @property {IColorInfo} [key: string] - Map of key to IColorInfo.
+     */
+    interface IPalette {
+        [key: string]: IColorInfo;
+    }
+
+    /**
+     * Interface for IColorPalette.
+     *
+     * @interface
+     */
+    export interface IColorPalette {
+        getColor(key: string): IColorInfo;
+        reset(): IColorPalette;
+        clear(): void;
+    }
+
+    /**
+     * Singleton reference of ColorPalette.
+     *
+     * @instance
+     */
+    var colorManager: IColorPalette;
+
+    /**
+     * Factory method for creating a ColorPalette.
+     *
+     * @function
+     * @param {IColorInfo[]} colors - Array of ColorInfo objects that contain
+     *                                hex values for colors.
+     */
+    export function createColorPalette(colors: IColorInfo[]): IColorPalette {
+        if(!colorManager)
+            colorManager = new ColorPalette(colors);
+
+        return colorManager;
+    }
+
+    class ColorPalette implements IColorPalette {
+        private colorPalette: IPalette = {};
+        private colors: IColorInfo[];
+        private colorIndex: number = 0;
+
+        constructor(colors: IColorInfo[]) {
+            this.colors = colors;
+        }
+
+        /**
+         * Gets color from colorPalette and returns an IColorInfo
+         *
+         * @function
+         * @param {string} key - Key of assign color in colorPalette.
+         */
+        public getColor(key: string): IColorInfo {
+            let color = this.colorPalette[key];
+            if(color) {
+                return color;
+            }
+
+            let colors = this.colors;
+            color = this.colorPalette[key] = colors[this.colorIndex++];
+
+            if(this.colorIndex >= colors.length) { 
+                this.colorIndex = 0;
+            }
+
+            return color;
+        }
+
+        /**
+         * resets colorIndex to 0
+         *
+         * @function
+         */
+        public reset(): IColorPalette {
+            this.colorIndex = 0;
+            return this;
+        }
+
+        /**
+         * Clears colorPalette of cached keys and colors
+         *
+         * @function
+         */
+        public clear(): void {
+            this.colorPalette = {};
+        }
+    }
+}

tsconfig.json

@@ -9,6 +9,7 @@
     },
     "files": [
         ".api/v1.1.0/PowerBI-visuals.d.ts",
+        "src/colorPalette.ts",
         "src/barChart.ts",
         "typings/index.d.ts"
     ]