Scatter chart
Scatter and bubble chart with nice axes, nearest-point tooltip by hover or keyboard, brush-to-zoom with reset, trend lines and legend toggles.
Preview
Load time vs conversion
120 sessionsDrag to zoom
| Series | Point | Load time (s) | Conversion % |
|---|---|---|---|
| Desktop | 1 | 2.3s | 3.1% |
| Desktop | 2 | 2.7s | 2.9% |
| Desktop | 3 | 3.5s | 2.1% |
| Desktop | 4 | 0.9s | 4.5% |
| Desktop | 5 | 2.7s | 2.7% |
| Desktop | 6 | 2.2s | 3.7% |
| Desktop | 7 | 2.0s | 3.6% |
| Desktop | 8 | 2.9s | 2.0% |
| Desktop | 9 | 1.2s | 3.8% |
| Desktop | 10 | 1.9s | 3.3% |
| Desktop | 11 | 2.6s | 2.3% |
| Desktop | 12 | 2.6s | 3.0% |
| Desktop | 13 | 2.0s | 3.9% |
| Desktop | 14 | 3.3s | 2.6% |
| Desktop | 15 | 1.7s | 3.9% |
| Desktop | 16 | 1.5s | 3.2% |
| Desktop | 17 | 3.1s | 3.2% |
| Desktop | 18 | 1.6s | 3.2% |
| Desktop | 19 | 3.1s | 2.1% |
| Desktop | 20 | 2.5s | 3.1% |
| Desktop | 21 | 3.5s | 1.5% |
| Desktop | 22 | 3.5s | 2.6% |
| Desktop | 23 | 1.9s | 2.7% |
| Desktop | 24 | 0.9s | 5.0% |
| Desktop | 25 | 2.3s | 3.2% |
| Desktop | 26 | 1.5s | 3.8% |
| Desktop | 27 | 3.1s | 1.8% |
| Desktop | 28 | 2.8s | 2.0% |
| Desktop | 29 | 2.1s | 3.5% |
| Desktop | 30 | 3.9s | 1.5% |
| Desktop | 31 | 2.2s | 3.0% |
| Desktop | 32 | 0.8s | 4.9% |
| Desktop | 33 | 2.0s | 3.8% |
| Desktop | 34 | 1.6s | 3.8% |
| Desktop | 35 | 1.8s | 4.1% |
| Desktop | 36 | 1.1s | 3.6% |
| Desktop | 37 | 2.7s | 2.9% |
| Desktop | 38 | 1.0s | 4.1% |
| Desktop | 39 | 1.9s | 4.2% |
| Desktop | 40 | 3.5s | 2.3% |
| Desktop | 41 | 2.0s | 4.1% |
| Desktop | 42 | 2.6s | 2.8% |
| Desktop | 43 | 1.6s | 3.7% |
| Desktop | 44 | 0.6s | 5.2% |
| Desktop | 45 | 1.6s | 3.6% |
| Desktop | 46 | 1.0s | 3.6% |
| Desktop | 47 | 3.1s | 2.5% |
| Desktop | 48 | 2.3s | 2.5% |
| Desktop | 49 | 2.5s | 3.1% |
| Desktop | 50 | 3.6s | 2.7% |
| Desktop | 51 | 2.6s | 3.0% |
| Desktop | 52 | 2.5s | 2.9% |
| Desktop | 53 | 0.9s | 4.6% |
| Desktop | 54 | 2.8s | 3.5% |
| Desktop | 55 | 3.0s | 1.9% |
| Desktop | 56 | 1.1s | 4.5% |
| Desktop | 57 | 3.9s | 1.4% |
| Desktop | 58 | 3.7s | 1.6% |
| Desktop | 59 | 3.2s | 2.6% |
| Desktop | 60 | 0.8s | 4.1% |
| Mobile | 1 | 2.9s | 1.7% |
| Mobile | 2 | 2.7s | 1.3% |
| Mobile | 3 | 3.0s | 1.2% |
| Mobile | 4 | 0.9s | 3.4% |
| Mobile | 5 | 1.9s | 2.0% |
| Mobile | 6 | 3.4s | 1.9% |
| Mobile | 7 | 3.2s | 0.6% |
| Mobile | 8 | 2.1s | 2.9% |
| Mobile | 9 | 2.5s | 2.3% |
| Mobile | 10 | 2.7s | 1.0% |
| Mobile | 11 | 2.3s | 2.1% |
| Mobile | 12 | 1.2s | 3.6% |
| Mobile | 13 | 0.8s | 2.7% |
| Mobile | 14 | 4.0s | 0.9% |
| Mobile | 15 | 3.0s | 2.1% |
| Mobile | 16 | 3.7s | 1.7% |
| Mobile | 17 | 0.8s | 2.9% |
| Mobile | 18 | 2.6s | 1.7% |
| Mobile | 19 | 2.0s | 2.4% |
| Mobile | 20 | 0.8s | 2.7% |
| Mobile | 21 | 2.2s | 1.9% |
| Mobile | 22 | 2.0s | 2.8% |
| Mobile | 23 | 2.0s | 2.1% |
| Mobile | 24 | 2.6s | 1.7% |
| Mobile | 25 | 3.9s | 0.5% |
| Mobile | 26 | 2.1s | 1.9% |
| Mobile | 27 | 2.9s | 1.3% |
| Mobile | 28 | 2.5s | 2.2% |
| Mobile | 29 | 0.6s | 3.0% |
| Mobile | 30 | 1.2s | 3.6% |
| Mobile | 31 | 1.1s | 3.7% |
| Mobile | 32 | 1.3s | 3.2% |
| Mobile | 33 | 3.4s | 1.6% |
| Mobile | 34 | 3.4s | 0.6% |
| Mobile | 35 | 0.9s | 3.7% |
| Mobile | 36 | 1.3s | 2.4% |
| Mobile | 37 | 1.8s | 2.0% |
| Mobile | 38 | 3.6s | 1.3% |
| Mobile | 39 | 3.0s | 1.6% |
| Mobile | 40 | 3.2s | 1.7% |
| Mobile | 41 | 1.9s | 2.9% |
| Mobile | 42 | 1.4s | 2.5% |
| Mobile | 43 | 1.1s | 3.4% |
| Mobile | 44 | 0.6s | 3.7% |
| Mobile | 45 | 3.9s | 1.4% |
| Mobile | 46 | 2.4s | 2.7% |
| Mobile | 47 | 0.8s | 3.5% |
| Mobile | 48 | 3.2s | 1.0% |
| Mobile | 49 | 3.9s | 0.3% |
| Mobile | 50 | 3.6s | 1.0% |
| Mobile | 51 | 3.8s | 1.7% |
| Mobile | 52 | 1.9s | 2.4% |
| Mobile | 53 | 2.1s | 1.7% |
| Mobile | 54 | 1.2s | 2.4% |
| Mobile | 55 | 0.9s | 4.0% |
| Mobile | 56 | 2.5s | 2.1% |
| Mobile | 57 | 1.4s | 3.6% |
| Mobile | 58 | 0.9s | 3.9% |
| Mobile | 59 | 1.5s | 2.1% |
| Mobile | 60 | 2.1s | 2.1% |
Price vs margin
Bubble = units sold| Series | Point | Price | Margin | Size |
|---|---|---|---|---|
| Goods | Starter kit | $29 | 18% | 412 units |
| Goods | Pocket notebook | $14 | 46% | 268 units |
| Goods | Desk lamp | $89 | 31% | 190 units |
| Goods | Travel mug | $24 | 52% | 355 units |
| Goods | Wool throw | $120 | 38% | 122 units |
| Goods | Pen set | $19 | 61% | 210 units |
| Goods | Monitor arm | $149 | 22% | 96 units |
| Goods | Cable tidy | $9 | 67% | 148 units |
| Services | Setup call | $60 | 72% | 84 units |
| Services | Annual care | $99 | 81% | 140 units |
| Services | Gift wrap | $6 | 74% | 61 units |
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| series | { key: string; label: string; color?: string; points: { x; y; size?; label? }[] }[] | — | Point groups, coloured per series. |
| label | string | — | Accessible name and caption of the hidden data table. |
| xLabel | string | — | X axis title. |
| yLabel | string | — | Y axis title. |
| height | number | 280 | Plot height in px; width follows the container. |
| bubble | boolean | false | Encode size as bubble area. |
| sizeRange | [number, number] | [4, 20] | Smallest and largest bubble radius in px. |
| trendLine | boolean | false | Least-squares trend line per series. |
| brush | boolean | true | Drag across the plot to zoom; Escape or Reset zoom returns. |
| legend | boolean | true | Toggleable series pills. |
| xFormatter | (v: number) => string | compact | Formats x ticks and values. |
| yFormatter | (v: number) => string | compact | Formats y ticks and values. |
| sizeFormatter | (v: number) => string | compact | Formats bubble sizes. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.