hoge3: .jsで読み込む XHRなので要httpdサーバー
<script src="ccchart-v1.08.7.js" charset="utf-8"></script>
<canvas id="hoge3"></canvas>
<script>
ccchart
.init('hoge3', data1)
.add(dataJS)
</script>
hoge4: .jsで読み込む XHRなので要httpdサーバー
<script src="ccchart-v1.08.7.js" charset="utf-8"></script>
<canvas id="hoge4"></canvas>
<script>
ccchart
.init('hoge4', dataJS)
.before(data1)
</script>
hoge5: .jsで読み込む XHRなので要httpdサーバー
<script src="ccchart-v1.08.7.js" charset="utf-8"></script>
<canvas id="hoge5"></canvas>
<script>
ccchart
.init('hoge5', dataJS)
.add(data1)
</script>
hoge6: .jsで読み込む XHRなので要httpdサーバー
<script src="ccchart-v1.08.7.js" charset="utf-8"></script>
<canvas id="hoge6"></canvas>
<script>
ccchart
.init('hoge6', dataJS)
.add(dataJS2)
</script>
var data1= {
"config": {
"type": "line",
"title": "data1",
"minY": 0,
"unit":"data1",
"useMarker":"css-ring",
"useVal": "yes",
"borderWidth": 4,
"hanreiMarkerStyle": 'arc',
"colorSet": ["#0c6","#fff"]
},
"data": [
["年度",2007,2008,2009,2010,2011,2012,2013],
["0-data1",3,43,45,35,56,67,90],
["1-data1",20,13,31,20,42,30,80]
]
}
var dataJS = {
"config": "./add-nomal-xhr-config.js",
"data": "./add-nomal-xhr-data.js"
};
var dataJS2 = {
"config": "./add-nomal-xhr-config2.js",
"data": "./add-nomal-xhr-data.js"
};
//./add-nomal-xhr-config.jsの中身
{
"title": ".js読み込み",
"subTitle": ".jsで読み込んでます",
"type": "bar",
"unit":"dataJS",
"hanreiMarkerStyle": "rect",
"unit": "円"
}
//./add-nomal-xhr-config2.jsの中身
{
"title": ".js読み込み line",
"subTitle": ".jsで読み込んでます line",
"type": "line",
"unit":"dataJS",
"useMarker": "css-ring",
"markerWidth": 12,
"hanreiMarkerStyle": "rect",
"unit": "円"
}
//./add-nomal-xhr-data.js
[
["年度",2007,2008,2009,2010,2011,2012,2013],
["0-dataJS",435,332,524,688,774,825,999],
["2-dataJS",600,335,584,333,457,788,900],
["3-dataJS",60,435,456,352,567,678,1260],
["4-dataJS",200,123,312,200,402,300,512]
]