@if (ViewBag.UsersRole == true)
    {
                <script>
                    google.charts.load('current', { 'packages': ['bar'] });
                    google.charts.setOnLoadCallback(drawChart);
                    var roles = [['Category', 'Budgeted', 'Expensed']];

                    function addPriority(Name, Budgeted, Balance){
                        Cate.push([Name, Budgeted, Balance]);
                    };


                    function drawChart() {
                        var data = google.visualization.arrayToDataTable([
                         ['Name', 'Amount', { role: 'style' }],
                         ['Admin', @ViewBag.AdminCount, '#e60000'],            // RGB value
                         ['Project Manager', @ViewBag.PMCount, 'color : #ffff00'],            // English color name
                         ['Developer', @ViewBag.DevCount, 'color : #53ff1a'],
                         ['Submitter', @ViewBag.SubCount, 'color : #0066ff' ], // CSS-style declaration
                        ]);
                        var options = {
                            width: '100%',
                            height: '100%',
                            bar: {groupWidth: "95%"},
                            legend: { position: "none"},
                            colors: ['#4CD45E']

                        };

                        var chart = new google.charts.Bar(document.getElementById('chart_div'));

                        chart.draw(data, google.charts.Bar.convertOptions(options));
                    }
                </script>
            }