View on GitHub

Ng-cells Color Palette

Download this project as a .zip file Download this project as a tar.gz file

Color palette

Directive

<div ngc-table
    data="smalldata"
    left-column-number="3" left-column-widths="'40px'"
    center-column-number="10" center-column-widths="['40px']"
    right-column-number="2" right-column-widths="['40px']"
    header-row-number="2" header-row-heights="['15px', '15px']"
    row-number='15' row-heights="['15px', '15px']"
    footer-row-number="3" footer-row-heights="'15px'">

    <ngc-range top="0" bottom="42" left="0" right="42" format-fn="colorCellFormat" style-fn="styleFn"></ngc-range>
</div>

Controller

angular.module('ngcTableDirectiveTest', ['ngcTableDirective'])
.controller('TestCtrl', function($scope) {
    $scope.smalldata = [];

    for (row = 0; row < 42; row++) {
        rowContent = [];
        for (col = 0; col < 42; col++) {
            rowContent.push(row * col + col);
        }
        $scope.smalldata.push(rowContent);
    }

    $scope.colorCellFormat = function(value, row, col) {
        var hex = (65536 * row  * 6 + 255 * 128 + col * 6).toString(16);
        hex = hex.length == 4 ? '00' + hex : hex.length == 5 ? '0' + hex : hex;
        return hex;
    };

    $scope.styleFn = function(value, row, col) {
        var rgb = 'background-color: rgb(' + (row  * 6) + ", 128, " + (col  * 6) + ")";
        return rgb;
    };
});