playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Quite good looking graph derived from d3.js http://c3js.org
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1782 Commits
10 Branches
97 Tags
10 MiB
Tree: e12ac635db
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'e12ac635db'
${ noResults }
c3/htdocs/samples/chart_area_step.html

50 lines
1.1 KiB
Raw Normal View History Unescape

Add sample for area chart
11 years ago
<html>
<head>
<link href="/css/c3.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="chart1"></div>
<div id="chart2"></div>
<div id="chart3"></div>
Fix bugs and update samples to use d3.v4
7 years ago
<script src="http://d3js.org/d3.v4.min.js" charset="utf-8"></script>
Add sample for area chart
11 years ago
<script src="/js/c3.js"></script>
<script>
var chart1 = c3.generate({
bindto: '#chart1',
data: {
columns: [
['data1', 300, 350, 300, 0, 0, 0],
['data2', 130, 100, 140, 200, 150, 50]
],
type: 'area-step'
}
});
var chart2 = c3.generate({
bindto: '#chart2',
data: {
columns: [
['data1', -300, -350, -300, 0, 0, 0],
['data2', -130, -100, -140, -200, -150, -50]
],
type: 'area-step'
}
});
var chart3 = c3.generate({
bindto: '#chart3',
data: {
columns: [
['data1', -300, 350, -300, 0, 0, 0],
['data2', -130, -100, 140, -200, 150, -50]
],
type: 'area-step'
}
});
</script>
</body>
</html>