forked from ~ulysseskao/xdashangular
blame | history | patch | commit | commitdiff | ignore whitespace
Dennis Kao
2016-04-26 f58eed4ff744969bc10af8ef1c4bed42c1e31eb0 
 grails-app/assets/templates/xdashangular/charts/chartjs.html


@@ -1,10 +1,104 @@


<!DOCTYPE html>


<html lang="en">


<head>


  <meta charset="UTF-8">


  <title>Title</title>


</head>


<body>


<!-- Content Header (Page header) -->


<section class="content-header">


  <h1>


    ChartJS


    <small>Preview sample</small>


  </h1>


  <ol class="breadcrumb">


    <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>


    <li><a href="#">Charts</a></li>


    <li class="active">ChartJS</li>


  </ol>


</section>




</body>


</html>


<!-- Main content -->


<section class="content">


  <div class="row">


    <div class="col-md-6">


      <!-- AREA CHART -->


      <div class="box box-primary">


        <div class="box-header with-border">


          <h3 class="box-title">Area Chart</h3>




          <div class="box-tools pull-right">


            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>


            </button>


            <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>


          </div>


        </div>


        <div class="box-body">


          <div class="chart">


            <canvas id="areaChart" style="height:250px"></canvas>


          </div>


        </div>


        <!-- /.box-body -->


      </div>


      <!-- /.box -->




      <!-- DONUT CHART -->


      <div class="box box-danger">


        <div class="box-header with-border">


          <h3 class="box-title">Donut Chart</h3>




          <div class="box-tools pull-right">


            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>


            </button>


            <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>


          </div>


        </div>


        <div class="box-body">


          <canvas id="pieChart" style="height:250px"></canvas>


        </div>


        <!-- /.box-body -->


      </div>


      <!-- /.box -->




    </div>


    <!-- /.col (LEFT) -->


    <div class="col-md-6">


      <!-- LINE CHART -->


      <div class="box box-info">


        <div class="box-header with-border">


          <h3 class="box-title">Line Chart</h3>




          <div class="box-tools pull-right">


            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>


            </button>


            <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>


          </div>


        </div>


        <div class="box-body">


          <div class="chart">


            <canvas id="lineChart" style="height:250px"></canvas>


          </div>


        </div>


        <!-- /.box-body -->


      </div>


      <!-- /.box -->




      <!-- BAR CHART -->


      <div class="box box-success">


        <div class="box-header with-border">


          <h3 class="box-title">Bar Chart</h3>




          <div class="box-tools pull-right">


            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>


            </button>


            <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>


          </div>


        </div>


        <div class="box-body">


          <div class="chart">


            <canvas id="barChart" style="height:230px"></canvas>


          </div>


        </div>


        <!-- /.box-body -->


      </div>


      <!-- /.box -->




    </div>


    <!-- /.col (RIGHT) -->


  </div>


  <!-- /.row -->




</section>