ひとつのHTMLファイル内にcanvasでグラフを2つ表示したいのです
ひとつのHTMLファイル内にcanvasでグラフを2つ表示したいのですが
表示できなくて困っています。
以下のサイトを参考に、それぞれ1つのファイルに1つのグラフを表示はできました。
http://www.html5.jp/library/index.html
また、グラフを上下入れ替えると後に書いたほうが有効になるようです。
どうしたら表示できるようになるか、わかる方アドバイスをお願いします。
以下headタグ以降をそのまま引用です。
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="ja"/> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>グラフ</title> <link href="sample_graph.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="rendering-mode.js"></script>
<!--[if IE]><script type="text/javascript" src="./html5jp/excanvas/excanvas.js"></script><![endif]-->
<script type="text/javascript" src="./html5jp/graph/circle.js"></script>
<script type="text/javascript" src="./html5jp/graph/radar.js"></script>
<script type="text/javascript">
window.onload = function() {
var rc = new html5jp.graph.radar("sample_radar");
if( ! rc ) { return; }
var items_radar = [ ["商品A", 3, 3, 2, 3, 1] ];
var params_radar = { aCap: ["A", "B","C", "D", "E"], aMax: 3, aMin: 0, legend: false } ;
rc.draw(items_radar, params_radar); };
</script>
<script type="text/javascript">
window.onload = function(){
var cg = new html5jp.graph.circle("sample_circle");
if( ! cg ) { return; }
var items1 = [ ["A", 9, ], ["B", 3, ], ["C", 0,] ];
cg.draw(items1); };
</script>
</head> <body>
<div><canvas width="300" height="200" id="sample_radar"></canvas></div>
<div><canvas width="300" height="200" id="sample_circle"></canvas></div>
</body> </html>
