Chartjs가 렌더링되지 않습니다

Question

Chartjs를 사용하여 도넛 형 차트에 정보를 표시하고 있습니다. html, Chart.js를 페이지에 포함 시켰으며 차트가 Chrome에 표시되지 않습니다. 웹 페이지에 표시하기 만하면됩니다. 내가 놓친 게 있니?

<!--=== Intro ===--> 
    <section class="hero bg-brand-fifth"> 
     <div class="col-lg-12 inner-container wow animated fadeInDown text-center"> 
       <h2 class="text-xl transparent-30">Our Metrics</h2><br> 


       <h1>Ages of Clients Served Through our I & R Management Program<br><span>2012-2013</span></h1> 

       <canvas id="hours" width="250" height="250"></canvas> 

       <div class="btn-group btn-group-lg "> 
        <button class="btn btn-outline btn-xl pull-left" type="button"> 
         <i class="fa fa-envelope text-transparent"></i> 
        </button> 
        <button class="btn btn-outline btn-xl">Contact Support</button> 
       </div><br> 
       <a href="#" class="transparent-30">Need Help?</a> 
     </div>    
     <div class="clearfix"></div> 
    </section><!--===/END intro ===--> 



    <!-- Core JavaScript Files --> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>  
     <!-- Plugins --> 
    <script src="js/Chart.js"></script> 
    <script> 
    var data = [ 
    { 
    value: 20, 
    color:"#637b85" 
    }, 
    { 
    value : 30, 
    color : "#2c9c69" 
    }, 
    { 
    value : 40, 
    color : "#dbba34" 
    }, 
    { 
    value : 10, 
    color : "#c62f29" 
    } 

    ]; 
    var hours = new Chart(document.getElementById("hours").getContext("2d")).Doughnut(data, options); 

    </script> 
    <!--<script src="js/main.js"></script>--> 
     <script src="plugins/WOW-master/dist/wow.js"></script> 
    <script> 
     new WOW().init(); 
    </script> 
     <script src="js/modernizr.js"></script> 
    <script src="js/easing.min.js"></script> 
    <!-- Custom JavaScript --> 
    <script src="js/act-subpages.js"></script> 

</body> 

Answer 1

매개 변수 옵션이 정의되어 있지 않습니다.

이 코드

var hours = new Chart(document.getElementById("hours").getContext("2d")).Doughnut(data); 

을 시도하거나이 코드는

// Get the context of the canvas element we want to select 
     var ctx = document.getElementById("hours").getContext("2d"); 
     var myNewChart = new Chart(ctx).Doughnut(data);