Gramex Packages

4 quadrants charts with its sub clusters data

A Sankey chart built with vega that uses 5 data points from frequency to recency.

scatter plot

Sparkline chart which helps compare values across periods

Treemap Reusable component

Treemap Reusable component

Horizontal tree with weights and click functionality and data configuration. This chart takes maximum number of children to be shown,all other values will be clubbed together and shown as others.

The drawAreaLineChart function is a JavaScript utility for creating area-line charts using the D3.js library. This function accepts a configuration object with parameters such as selector, data, xColumn, yColumn, period, width, and height. It generates an

Gramex Bar Chart for Reusability

bar chart

The bullet chart is a compact and efficient way to display performance data, comparing a primary measure to one or more other measures. It is particularly useful for visualizing key performance indicators (KPIs) and their targets.

Chord chart with transaction from one set of data to another set of data with dynamic coloring options

scatter plot

Gramex multiline Chart for Reusability

D3 nested Reusable component

gramex normal distribution chart

This JavaScript function utilizes the D3 library to draw a histogram bullet chart. The chart visualizes a current value in comparison to a target value across different color-coded ranges. Additionally, it includes interactive features such as tooltips.

Area chart

d3 Responsive Bar Chart for Reusability

A boilerplate to start using Gramex