gramex-stacked-plot v7.2.4

GRAMEX STACKED PLOT

d3 stacked plot rendering for reusability purpOse.

Installation

  npm install gramex-stacked-plot

Dependencies

  npm install d3
  npm install lodash

Options/Config

Following options are available:

Usage/Examples

HTML

<div id="gramexStackedPlot" class=''></div>

JS

const config = {
        width: 952,
        height: 500,
        marginTop: 178,
        marginBottom: 55,
        marginLeft: 70,
        marginRight: 57,
        labelTopPadding: 15,
        labelRightPadding: 35,
        data: [
              {brand: 'Pepsi', animatic: 52, finished_film: 30},
              {brand: 'Lays', animatic: 40, finished_film: 40},
              {brand: 'coka, cola', animatic: 45, finished_film: 50},
              {brand: 'Rockstar, Energy', animatic: 30, finished_film: 40},
              {brand: 'Funny, Frish', animatic: 25, finished_film: 40},
              {brand: 'Red, Bull', animatic: 20, finished_film: 70},
              {brand: '28 Black', animatic: 15, finished_film: 22},
              {brand: 'Lorenz', animatic: 60, finished_film: 46},
              {brand: 'Rockstar', animatic: 35, finished_film: 67}
        ]
    };
    renderStackedPlot("#gramexStackedPlot", config)