@coreui/ajax/AngularJS_Full_Project_GULP/views/charts.html

Open Source Bootstrap Admin Template

<div class="animated fadeIn">
    <div class="card-columns cols-2">
        <div class="card">
            <div class="card-header">
                <i class="icon-graph icon-bg"></i>Line Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="LineCtrl">
                <canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels" chart-legend="true" chart-series="series" chart-click="onClick"></canvas>
            </div>
        </div>
        <div class="card">
            <div class="card-header">
                <i class="icon-graph icon-bg"></i>Bar Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="BarCtrl">
                <canvas id="bar" class="chart chart-bar" chart-data="data" chart-labels="labels">
                </canvas>
            </div>
        </div>
        <div class="card">
            <div class="card-header">
                Doughnut Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="DoughnutCtrl">
                <canvas id="doughnut" class="chart chart-doughnut" chart-data="data" chart-labels="labels">
                </canvas>
            </div>
        </div>
        <div class="card">
            <div class="card-header">
                Radar Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="RadarCtrl">
                <canvas id="radar" class="chart chart-radar" chart-data="data" chart-labels="labels">
                </canvas>
            </div>
        </div>
        <div class="card">
            <div class="card-header">
                <i class="fa fa-asterisk icon-bg"></i>Pie Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="PieCtrl">
                <canvas id="pie" class="chart chart-pie" chart-data="data" chart-labels="labels">
                </canvas>
            </div>
        </div>
        <div class="card">
            <div class="card-header">
                Polar Area Chart
                <div class="card-actions">
                    <a href="http://jtblin.github.io/angular-chart.js/">
                        <small class="text-muted">docs</small>
                    </a>
                </div>
            </div>
            <div class="card-block" ng-controller="PolarAreaCtrl">
                <canvas id="polar-area" class="chart chart-polar-area" chart-data="data" chart-labels="labels">
                </canvas>
            </div>
        </div>
    </div>
</div>