mirror of https://github.com/masayuki0812/c3.git
Masayuki Tanaka
11 years ago
1 changed files with 72 additions and 0 deletions
@ -0,0 +1,72 @@
|
||||
<html> |
||||
<head> |
||||
<link rel="stylesheet" type="text/css" href="/css/c3.css"> |
||||
</head> |
||||
<body> |
||||
<div id="chart"></div> |
||||
|
||||
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> |
||||
<script src="/js/c3.js"></script> |
||||
<!-- <script src="/js/c3.min.0.1.35.js"></script>--> |
||||
<script> |
||||
|
||||
var dates = ['date', |
||||
1401908040000, |
||||
1401907980000, |
||||
1401907920000, |
||||
1401907860000, |
||||
1401907800000, |
||||
1401907740000, |
||||
1401907680000, |
||||
1401907620000, |
||||
1401907560000, |
||||
1401907500000 |
||||
]; |
||||
|
||||
var chart = c3.generate({ |
||||
bindto: '#chart', |
||||
data: { |
||||
x : 'date', |
||||
columns: [ |
||||
dates, |
||||
['data1', 30, 200, 100, 400, 150, 250, 30, 200, 100, 400], |
||||
['data2', 130, 300, 200, 450, 250, 350, 130, 300, 200, 450] |
||||
], |
||||
types: { |
||||
data1: 'bar', |
||||
} |
||||
}, |
||||
axis : { |
||||
x : { |
||||
type : 'timeseries', |
||||
tick : { |
||||
format : "%Y-%m-%d %H:%M:%S" |
||||
} |
||||
} |
||||
} |
||||
}); |
||||
|
||||
/* |
||||
setTimeout(function () { |
||||
chart.load({ |
||||
columns: [ |
||||
['sample', 200, 130, 90, 240, 130, 100], |
||||
['sample2', 300, 200, 160, 400, 250, 250] |
||||
] |
||||
}); |
||||
}, 1000); |
||||
|
||||
setTimeout(function () { |
||||
chart.load({ |
||||
columns: [ |
||||
['date', '20140101', '20140201', '20140301', '20140401', '20140501', '20140601'], |
||||
['sample', 500, 630, 690, 440, 630, 900], |
||||
['sample2', 400, 600, 460, 200, 350, 450] |
||||
] |
||||
}); |
||||
}, 2000); |
||||
|
||||
*/ |
||||
</script> |
||||
</body> |
||||
</html> |
Loading…
Reference in new issue