templates/charts-chartjs.html.twig line 1

Open in your IDE?
  1. {{ include('partials/main.html.twig') }}
    
        <head>
            
            {{ include('partials/title-meta.html.twig', {title: 'Chartjs'}) }}
    
            {{ include('partials/head-css.html.twig') }}
    
        </head>
    
        {{ include('partials/body.html.twig') }}
    
            <!-- Begin page -->
            <div id="layout-wrapper">
    
                {{ include('partials/menu.html.twig') }}
    
                <!-- ============================================================== -->
                <!-- Start right Content here -->
                <!-- ============================================================== -->
                <div class="main-content">
    
                    <div class="page-content">
                        <div class="container-fluid">
    
                            {{ include('partials/page-title.html.twig', {pagetitle: 'Charts', title: 'Chartjs'}) }}
    
                            <div class="row">
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Line Chart</h4>
                                        </div>
                                        <div class="card-body">
            
                                            <canvas id="lineChart" height="300" data-colors='["rgba(81, 86, 190, 0.2)", "#5156be", "rgba(235, 239, 242, 0.2)", "#ebeff2"]'></canvas>
            
                                        </div>
                                    </div>
                                </div> <!-- end col -->
            
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Bar Chart</h4>
                                        </div>
                                        <div class="card-body">
            
                                            <canvas id="bar" height="300" data-colors='["rgba(41, 181, 125, 0.8)", "rgba(41, 181, 125, 0.9)"]'></canvas>
            
                                        </div>
                                    </div>
                                </div> <!-- end col -->
                            </div> <!-- end row -->
            
            
                            <div class="row">
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Pie Chart</h4>
                                        </div>
                                        <div class="card-body">
            
                                            <canvas id="pie" height="260" data-colors='["#2ab57d", "#ebeff2"]'></canvas>
            
                                        </div>
                                    </div>
                                </div> <!-- end col -->
            
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Donut Chart</h4>
                                        </div>
                                        <div class="card-body">
            
                                            <canvas id="doughnut" height="260" data-colors='["#5156be", "#ebeff2"]'></canvas>
            
                                        </div>
                                    </div>
                                </div> <!-- end col -->
                            </div> <!-- end row -->
            
                            <div class="row">
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Polar Chart</h4>
                                        </div>
                                        <div class="card-body">
            
                                            <canvas id="polarArea" height="300" data-colors='["#fd625e", "#2ab57d", "#ffbf53", "#5156be"]'> </canvas>
            
                                        </div>
                                    </div>
                                </div> <!-- end col -->
            
                                <div class="col-xl-6">
                                    <div class="card">
                                        <div class="card-header">
                                            <h4 class="card-title mb-0">Radar Chart</h4>
                                        </div>
                                        <div class="card-body">
                                            <canvas id="radar" height="300" data-colors='["rgba(42, 181, 125, 0.2)", "#2ab57d", "rgba(81, 86, 190, 0.2)", "#5156be"]'></canvas>
                                        </div>
                                    </div>
                                </div> <!-- end col -->
                            </div> <!-- end row -->
                            
                        </div> <!-- container-fluid -->
                    </div>
                    <!-- End Page-content -->
    
                    
                    {{ include('partials/footer.html.twig') }}
                </div>
                <!-- end main content-->
    
            </div>
            <!-- END layout-wrapper -->
    
            {{ include('partials/right-sidebar.html.twig') }}
    
            {{ include('partials/vendor-scripts.html.twig') }}
    
            <!-- Chart JS -->
            <script src="/libs/chart.js/dist/Chart.bundle.min.js"></script>
            <!-- chartjs init -->
            <script src="/js/pages/chartjs.init.js"></script> 
    
            <script src="/js/app.js"></script>
    
        </body>
    </html>