Chart Tooltips Blocks
Custom external tooltips and hover interactions for charts.
Workout intensity overview
Preview
Code
Running
180 bpm Cardio beats per month
Preview
Code
Feb 24
Running
165 bpm Session beats
Preview
Code
Mar 24
Running
172 bpm Daily issues status
Preview
Code
Oct 3, 2024
completed
45
in progress
23
on hold
16
Task progress split
Preview
Code
Oct 5, 2024
completed
68 (74%)
in progress
24 (26%)
Monthly sales delta
Preview
Code
Jun 24
$89,342 +12.4%
Revenue overview
Preview
Code
May 24
$67,830
+12.50% from previous month
Status distribution
Preview
Code
StatusOct 5
completed24(13.79%)
in progress54(31.03%)
on hold96(55.17%)
Revenue vs Profit
Preview
Code
May 2412pm
$89,342Revenue
$67,830Profit
Health snapshot
Requires: progress-circle
Preview
Code
Effort
75%
Recovery
25%
Strain
0.8
Sleep
95%
BPM change
Preview
Code
Mar 24
172 bpm
+8.2%
from prev. month
Monthly Running Metric
Preview
Code
Apr 24+5.2%
Running
158 bpmCompact BPM Tooltip
Preview
Code
Running165 bpm
Activities split
Preview
Code
Running
169 bpm
Cycling
145 bpm
Segmented tooltip
Preview
Code
May 24
Running
165 bpm
Cycling
145 bpm
Inverse colored tooltip with delta
Preview
Code
Revenue
$67,830+12.4%
Sales Goal Progress
Requires: progress-circle
Preview
Code
May 24
75.2%
$67,830Revenue
Location shares tooltip
Requires: category-bar
Preview
Code
Europe
1,200(34.3%)
Asia
800(22.9%)
North America
1,500(42.9%)
Tooltip with doughnut chart
Preview
Code
Tooltip with inline doughnut chart
Preview
Code
Glass effect background
Preview
Code
StatusOct 5
completed45(25.0%)
in progress67(37.2%)
on hold68(37.8%)