Service_Matrix

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.408/styles/kendo.blueopal.min.css">
<script src="//fonts.googleapis.com/css?family=Allerta&amp;subset=latin"></script>
<script src="//fonts.googleapis.com/css?family=Capriola&amp;subset=latin"></script>
<link rel="stylesheet" href="http://test.neonet.org/matrix/web/css/matrix-v1.css">
<script src="http://cdn.kendostatic.com/2015.1.408/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2015.1.408/js/kendo.all.min.js"></script>
<script src="http://cdn.kendostatic.com/2015.1.408/js/jszip.min.js"></script>
<body>
    <div id="neonetMatrix" style="display: block;">
        <div id="pivot-wrapper">
            <div id="pivotgrid">
            </div>
        </div>
    </div>

        <script id="dataCellTemplate" type="text/x-kendo-tmpl">
                # var columnMember = columnTuple ? columnTuple.members[0] : { children: [] }; # 
                # var rowMember = rowTuple ? rowTuple.members[0] : { children: [] }; #
                # var total = (dataItem.value == undefined) ? 0: dataItem.value; #
                
                # if (columnMember.children.length && rowMember.children.length) { #
                    <div class="allTotal"></div>
                # }
                else if (columnMember.children.length) { #
                    <div class="totalWrapper" data-tt="#:  kendo.toString((kendo.parseInt(total) / (kendo.parseInt(columnMember.children.length))),"p") #">
                    <div style="color: blue; " class="total"><i>#: total #</i></div>
                    <div class="percent" style="display: none">#:  kendo.toString((kendo.parseInt(total) / (kendo.parseInt(columnMember.children.length))),"p") #</div>    
                    </div>
            # }
                else if (rowMember.children.length){ #
                    <div class="totalWrapper" data-tt="#: ...