ccchart
http://ccchart.com
デモ・日本語ドキュメントがそろっている。特にデモの数が、非常に細かいレベルで揃っていてありがたい。
まだ実装はしてないけど、オプションも多いし、サンプルも多いし一番とっつきやすく、かつ色々なことが出来そう。
ということで、当面は「ccchart」で遊ぶ。
///////
ccchart 001 (散布図) 実験
///////
//////
//////
ccchart 001 (散布図) 実験
///////
//////
<script src="http://ccchart.com/js/ccchart.js" charset="utf-8"></script>
<canvas id="hoge"></canvas>
<script>
var chartdata91 = {
"config": {
"title": "scatter Chart",
"titleColor": "#ccc",
"subTitle": "散布図",
"subTitleColor": "#ccc",
"type": "scatter",
"useMarker": "maru",
"xLines": "none",
"xScaleSkip": 0,
"maxWsColLen": 120,
"shadows": {"hanrei":["#333",5,5,5]},
"colorSet":
["rgba(153,153,255,0.8)","rgba(255,204,102,0.8)","rgba(250,50,0,0.8)"],
"bgGradient": {
"direction":"vertical",
"from":"#111",
"to":"#798589"
}
},
"data": [
["時間","test-1","test-1","test-0","test-1","test-1","test-2","test-0","test-2","test-2","test-0","test-1","test-0","test-1","test-1","test-2","test-1","test-0","test-1","test-1","test-0","test-1","test-0","test-1","test-0","test-0","test-1","test-0","test-1","test-0","test-0","test-2","test-1","test-2","test-0","test-2","test-2","test-0","test-1","test-0","test-2","test-2","test-2","test-0","test-2","test-2","test-2","test-0","test-2","test-0","test-2","test-1","test-2","test-0","test-1","test-0","test-0","test-2","test-2","test-1","test-2","test-1","test-2","test-1","test-2","test-2","test-2","test-2","test-1","test-2","test-2","test-1","test-0","test-0","test-2","test-0","test-2","test-0","test-0","test-2","test-1","test-1","test-0","test-0","test-1","test-2","test-2","test-0","test-2","test-1","test-0","test-2","test-1","test-2","test-1","test-0","test-1","test-2","test-0","test-1","test-2","test-1","test-1","test-0","test-0","test-0","test-2","test-1","test-0","test-2","test-1","test-2","test-2","test-0","test-1","test-0","test-0","test-0","test-2","test-2","test-0"],
["s2",51,71,51,90,20,30,42,65,93,18,17,47,3,7,57,55,77,26,74,75,77,71,88,67,20,53,22,14,24,33,82,18,92,73,35,26,27,70,10,62,37,11,77,15,63,55,18,33,87,24,66,65,51,23,18,7,70,66,73,25,11,28,79,41,9,48,59,31,65,62,0,16,69,31,38,30,22,19,80,81,77,45,28,55,85,75,62,27,25,95,68,80,46,58,56,93,62,83,30,79,64,13,34,89,69,75,72,75,90,22,41,71,44,21,60,48,72,8,84,17],
["s3",46,65,34,57,49,25,23,45,4,10,20,51,57,29,34,48,55,27,20,17,36,44,20,23,38,44,27,2,11,52,51,22,21,60,41,34,52,57,45,39,40,17,40,20,9,49,22,59,4,48,30,55,29,14,58,39,47,5,32,38,3,56,22,7,8,21,45,24,43,28,17,53,43,24,47,19,15,46,15,29,30,41,32,20,49,19,42,4,28,11,15,42,26,38,52,65,52,24,45,50,24,45,34,15,61,31,33,61,13,40,29,44,33,60,27,44,44,12,9,35]
]
};
ccchart.init('hoge', chartdata91);
</script>
//////