Chart

Area chart shows data trends with shaded areas under lines.

Installation

CLI

Manual

In the terminal, run the following command to begin:

npx hq-kit add chart

Area Chart

Basic

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Custom Format

Preview

Code

Net revenue by month

Revenue minus expenses to show monthly profitability.

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Legend

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Colors

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Controlled

Preview

Code

Engagement

Likes, comments, and shares over a dynamic time range.

Stacked

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Bar Chart

Basic

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Custom Format

Preview

Code

Net revenue by month

Revenue minus expenses to show monthly profitability.

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Legend

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Colors

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Controlled

Preview

Code

Engagement

Likes, comments, and shares over a dynamic time range.

Stacked

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Line Chart

Basic

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Custom Format

Preview

Code

Net revenue by month

Revenue minus expenses to show monthly profitability.

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Legend

Preview

Code

Engagement last 7d

Likes, comments, and shares for the recent week.

Custom Colors

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Controlled

Preview

Code

Engagement

Likes, comments, and shares over a dynamic time range.

Stacked

Preview

Code

Engagement last 7d

Tracks likes, comments, and shares during the most recent 7-day period.

Pie Chart

Basic

Preview

Code

Traffic source breakdown

Where your website traffic is coming from.

Custom Colors

Preview

Code

Traffic source breakdown

Where your website traffic is coming from.

Donut

Preview

Code

Monthly spend breakdown

Shows where the money goes each month.

Label Inside

Preview

Code

Device usage

Breakdown of users by device type.

Custom Label

Preview

Code

Monthly spend breakdown

Shows where the money goes each month.

Gap

Preview

Code

Traffic source breakdown

Where your website traffic is coming from.

Controlled

Preview

Code

Audience insights

Engagement metrics by type

Chart

Installation

Area Chart

Basic

Custom Format

Custom Tooltip

Custom Legend

Custom Colors

Controlled

Stacked

Bar Chart

Basic

Custom Format

Custom Tooltip

Custom Legend

Custom Colors

Controlled

Stacked

Line Chart

Basic

Custom Format

Custom Tooltip

Custom Legend

Custom Colors

Controlled

Stacked

Pie Chart

Basic

Custom Colors

Donut

Label Inside

Custom Label

Gap

Controlled

On this page