ProjectActivityChart.svelte

A large line chart of weekly commit activity with every fuz.dev project drawn over one another, sharing one time window and one scale.

Each project's line uses its color_class from project_items (the ProjectLinks grid doubles as the legend), with the same per-point alpha fade and end dot as Sparkline. Hovering a line shows the project's stats via a native title. The svg scales to its container's width.

The background is a light wash of currentColor (the inherited text color), overridable with the --sparkline_bg custom property.

view source

Declarations
#

ProjectActivityChart
#

ProjectActivityChart.svelte view source

accepts children

import ProjectActivityChart from '@fuzdev/fuz_ui/ProjectActivityChart.svelte';

width?

Width of the svg's coordinate space in px; rendering stretches to the container.

type number
optional default 800

height?

Height of the svg's coordinate space in px.

type number
optional default 160

scale?

Vertical scale for the lines' geometry — see SparklineScale.

optional default 1 / 3

stroke_width?

type number
optional default 2

alpha_floor?

Stroke alpha at a value of 0, scaling linearly to 1 at the shared max.

type number
optional default 0.4

label?

Accessible label for the chart.

type string
optional default 'weekly commit activity for all projects, drawn over one another at a shared scale'

external types

OmitStrict<SvelteHTMLElements['svg'], 'width' | 'height' | 'scale'>

Depends on
#