Chartist

Larga dataset in dense grid

by Nikhil

HTML

<link rel="stylesheet" href="https://rawgit.com/gionkunz/chartist-js/master/dist/chartist.min.css">
<script src="https://rawgit.com/gionkunz/chartist-js/master/dist/chartist.min.js"></script>
<div class="ct-chart ct-square"></div>

CSS

.ct-chart{
  height:500px;
}

JavaScript

new new Chartist.Bar('.ct-chart', {
  labels: ['W1', 'W2', 'W3', 'W4', 'W5', 'W6', 'W7', 'W8', 'W9', 'W10'],
  series: [
    [-1, -2, -4, -8, -6, -2, -1, -4, -10, -2], // negative series
    [1, 2, 4, 8, 6, 2, 1, 4, 10, 2], // positive values of the negative series
    [5, 20, 5, 5, 21, 12, 22, 3, 20, 2], // positive series
   ]
}, {
  stackBars: true,
  high: 30,
  low: -30
  });