2017-02-09 34 views
0

私はC3.jsの折れ線グラフを生成するには、このコードを使用しますがC3.js折れ線グラフエラー

解決策を探して

Uncaught ReferenceError: c3 is not defined at index.html

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>C3Charts</title> 
 
    <script> 
 
    //Column data 
 
    var chart = c3.generate({ 
 
     bindto: '#chart', 
 
     data: { 
 
     columns: [ 
 
      ['data1', 30, 200, 100, 400, 150, 250], 
 
      ['data2', 50, 20, 10, 40, 15, 25] 
 
     ] 
 
     } 
 
    }); 
 
    </script> 
 
</head> 
 

 
<body> 
 

 
    <div id="chart"> 
 

 
    </div> 
 

 
    <!-- Load c3.css --> 
 
    <link href="bower_components/c3/c3.css" rel="stylesheet" type="text/css"> 
 

 
    <!-- Load d3.js and c3.js --> 
 
    <script src="bower_components/d3/d3.min.js" charset="utf-8"></script> 
 
    <script src="bower_components/c3/c3.min.js"></script> 
 
</body> 
 

 
</html>

としてコンソールにエラーに遭遇しています

答えて

-1

あなたの位置に問題があります

<script> 
//Column data 
var chart = c3.generate({ 
    bindto: '#chart', 
    data: { 
    columns: [ 
     ['data1', 30, 200, 100, 400, 150, 250], 
     ['data2', 50, 20, 10, 40, 15, 25] 
    ] 
    } 
}); 
現在 ヘッドタグに配置されて

The solution is to move you script tag after c3.js and your <div id="chart"></div> is loaded.