tick period test
HTML
<script src="https://cdn.jsdelivr.net/npm/d3@4.13.0/build/d3.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/taucharts@2/dist/taucharts.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/taucharts@2/dist/taucharts.min.css">
<div id="target"></div>
CSS
html,
body,
#target {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
JavaScript
new Taucharts.Chart({
type: 'stacked-area',
x: 'date',
y: 'effort',
color: 'team',
data: [
{team: 'Alpha', date: '2015-07-15', effort: 400},
{team: 'Alpha', date: '2015-07-16', effort: 200},
{team: 'Alpha', date: '2015-07-17', effort: 300},
{team: 'Alpha', date: '2015-07-18', effort: 500},
{team: 'Beta', date: '2015-07-15', effort: 100},
{team: 'Beta', date: '2015-07-16', effort: 200},
{team: 'Beta', date: '2015-07-17', effort: 300},
{team: 'Beta', date: '2015-07-18', effort: 100},
{team: 'Gamma', date: '2015-07-15', effort: 300},
{team: 'Gamma', date: '2015-07-16', effort: 100},
{team: 'Gamma', date: '2015-07-17', effort: 100},
{team: 'Gamma', date: '2015-07-18', effort: 200}
]
}).renderTo('#target');