Chart methods

Chart methods & global config

Every Chart object returned by SeraPlot supports the same fluent API. Set defaults once with sp.config() and tweak per chart with chainable methods. All methods return a new Chart, so chaining is always safe.

Fluent APIGlobal + per-chart override60+ chart typesPlotly-compatible value labels

1Global config 2Themes 3Background & frame 4Grid & axes 5Title & legend 6Typography 7Value labels 8Bar styling 9Animation & interactivity 10Responsive & layout 11Export & download 12Custom CSS / JS 13Accessibility & CSP 14Diff & introspection 15Magic properties

Global config

Set defaults once. Every chart created afterwards inherits this configuration automatically.

Parameter	Type	Default	Effect
`font`	str	system	Font family for every text element
`font_size`	int	12	Base font size in px
`title_size`	int	16	Title font size in px
`border_radius`	int	0	Container border radius (px)
`opacity`	float	1.0	Element opacity 0.0–1.0
`responsive`	bool	False	Auto-resize to container width
`animation`	bool	False	Fade-in animation on chart load
`animation_duration`	int	300	Animation duration in ms
`crosshair`	bool	False	Crosshair lines follow mouse hover
`zoom`	bool	False	Mouse wheel zoom + pan (double-click resets)
`tooltip`	str	—	Tooltip mode
`locale`	str	—	Number formatting locale
`thousands_sep`	str	—	Thousands separator character
`margin`	int	0	Container padding (px)
`export_button`	bool	False	Show download button on each chart
`palette`	list[int]	—	Color palette as hex ints (e.g. `[0x6366F1,0xFB7185]`)
`background`	str	—	Background color (any CSS color)
`gridlines`	bool	False	Show grid lines in chart
`text_auto`	bool / str	False	Display values on bars/markers (`True` raw, or d3 format like `".2s"`)
`text_position`	str	"auto"	`"auto"` / `"inside"` / `"outside"`
`text_angle`	int	0	Value label rotation (deg)
`text_font_size`	int	12	Max font size for value labels (px)
`text_font_color`	str	—	Value label color
`uniform_text_min_size`	int	0	Minimum px before label is hidden
`uniform_text_mode`	str	"hide"	`"hide"` small labels or `"show"` overflow
`bar_corner_radius`	int / str	0	Bar corner radius in px or `"20%"` of bar width

sp.config(**kwargs)global

Apply persistent defaults to all subsequent charts.

import seraplot as sp
sp.config(
font="Inter", font_size=12, title_size=16,
crosshair=True, zoom=True, animation=True,
palette=[0x6366F1, 0xFB7185, 0x10B981],
background="#fafafa", border_radius=8, margin=16,
)
chart = sp.bar("Sales", ["Q1","Q2","Q3"], [100,150,120])

sp.reset_config()global

Clear every global setting back to factory defaults.

sp.reset_config()
chart = sp.bar("Clean", labels, values)

Themes

Curated presets that combine palette, background and gridlines.

Theme	Mood
`"dark"`	High-contrast dark dashboard
`"light"`	Soft pastel light backdrop
`"scientific"`	Publication-style monochrome
`"apple"`	Glassy iOS-inspired palette
`"notion"`	Calm Notion-style neutrals
`"minimal"`	Bare lines, no chrome
`"neon"`	Vibrant cyberpunk neons

sp.theme(name)global

Apply a preset theme. Combine with sp.config() overrides.

sp.theme("dark")
chart = sp.bar("Modern", labels, values)

sp.themes() -> list[str]global

List every available theme name.

available = sp.themes()
print(available)

sp.reset_theme()global

Reset back to no theme (default palette, no background, no gridlines).

sp.reset_theme()

Background & frame

.set_bg(color=None) -> Chartchainable

Set the HTML wrapper background. Accepts any CSS color or None for transparent.

chart = sp.line("Trend", x, y).set_bg("#0f172a")
chart = sp.pie("Share", labels, values).set_bg(None)

.set_frame(color=None) -> Chartchainable

Set the SVG canvas background, independent from the HTML wrapper.

chart = sp.bar("Title", labels, values).set_frame("transparent")

sp.set_global_background(color)global

Apply a background to every chart created afterwards. Useful for notebooks.

sp.set_global_background("#0f172a")
chart1 = sp.bar(...)
chart2 = sp.scatter(...)
sp.reset_global_background()

Grid & axes

.show_grid() -> Chartchainable

Force gridlines on (overrides config).

chart = sp.bar("Data", labels, values).show_grid()

.hide_grid() -> Chartchainable

Force gridlines off.

chart = sp.bar("Data", labels, values, gridlines=True).hide_grid()

.no_x_axis() -> Chartchainable

Drop X-axis line, ticks and labels.

chart = sp.bar("Y only", labels, values).no_x_axis()

.no_y_axis() -> Chartchainable

Drop Y-axis line, ticks and labels.

chart = sp.bar("X only", labels, values).no_y_axis()

.no_axes() -> Chartchainable

Drop both axes at once.

chart = sp.scatter("Clean", x, y).no_axes()

Title & legend

.no_title() -> Chartchainable

Hide the chart title.

chart = sp.pie("Internal", labels, values).no_title()

.no_legend() -> Chartchainable

Hide the legend (multi-series charts).

chart = sp.grouped_bar("Q1", cats, series).no_legend()

.title_size(px: int) -> Chartchainable

Override title font size for this chart.

chart = sp.bar("Big", labels, values).title_size(24)

Typography

.font(name: str) -> Chartchainable

Override the font family for this chart.

chart = sp.bar("Roboto", labels, values).font("Roboto")

.set_font_size(px: int) -> Chartchainable

Override base text size for all axis/legend labels.

chart = sp.radar("Skills", labels, values).set_font_size(11)

.text_font(family=None, size=None, color=None) -> Chartchainable

Style the value labels (text_auto family).

chart = sp.bar("Styled", labels, values).text_font(family="Courier", size=11, color="#333")

Value labels

Tip: works on every chart that emits data-v attributes — bars, lollipops, scatter, pie, treemap, line markers… Format strings follow d3 / Plotly conventions: ".2s", ".0f", ".1%".

.text_auto(format=True, position=None, angle=None, font_size=None, color=None) -> Chartchainable

Show value labels on every data point. format=True uses raw values; pass a d3 format string for fancy formatting.

chart = sp.bar("Raw", labels, values).text_auto(True)
chart = sp.pie("Pct", labels, values).text_auto(".1%", position="outside")
chart = sp.bar("SI", labels, values).text_auto(".2s", angle=45, font_size=13)

.text_position(position: str) -> Chartchainable

Override label placement: "auto", "inside", "outside".

chart = sp.bar("Out", labels, values).text_position("outside")

.text_angle(degrees: int) -> Chartchainable

Rotate value labels by N degrees.

chart = sp.bar("Rot", labels, values).text_angle(90)

.uniform_text(min_size=8, mode="hide") -> Chartchainable

Force consistent label sizing. mode="hide" drops labels smaller than min_size; "show" allows overflow.

chart = sp.bar("Uniform", labels, values).uniform_text(min_size=10, mode="hide")

Bar styling

.corner_radius_bars(radius) -> Chartchainable

Round bar corners. Accepts an integer (pixels) or a string like "20%" of the bar width.

chart = sp.bar("Modern", labels, values).corner_radius_bars(8)
chart = sp.bar("Pct", labels, values).corner_radius_bars("15%")

Animation & interactivity

.animate(duration=300) -> Chartchainable

Fade-in animation. Pass duration in ms.

chart = sp.bar("Fade", labels, values).animate(500)

.crosshair() -> Chartchainable

Crosshair lines follow the mouse.

chart = sp.scatter("XY", x, y).crosshair()

.zoom() -> Chartchainable

Mouse-wheel zoom and pan; double-click resets.

chart = sp.line("Big", x, y).zoom()

.no_hover() -> Chartchainable

Disable all hover effects and tooltips.

chart = sp.bar("Static", labels, values).no_hover()

Responsive & layout

.responsive() -> Chartchainable

Auto-resize to the parent container width.

chart = sp.bar("Fluid", labels, values).responsive()

.border_radius(px: int) -> Chartchainable

Set the container border radius.

chart = sp.bar("Round", labels, values).border_radius(12)

.set_margin(px: int) -> Chartchainable

Set the container padding.

chart = sp.scatter("Pad", x, y).set_margin(20)

.set_opacity(value: float) -> Chartchainable

Set element opacity (0.0–1.0).

chart = sp.bar("Faded", labels, values).set_opacity(0.7)

.scale(factor: float) -> Chartchainable

Scale chart by multiplier (1.0 = normal).

chart = sp.pie("Big", labels, values).scale(1.5)

Export & download

.save(path: str)export

Write chart HTML to disk.

chart.save("chart.html")

.show()export

Display chart in Jupyter via IPython.display.

sp.scatter("Data", x, y).show()

.to_svg() -> strexport

Return the inner <svg> element as a string.

svg = chart.to_svg()

.export_svg(path: str)export

Save the SVG portion to disk.

chart.export_svg("chart.svg")

.export_png(path: str, scale=2.0)export

Export PNG (requires cairosvg).

chart.export_png("chart.png", scale=1.5)

.export_button() -> Chartchainable

Add a download button on the chart.

chart = sp.pie("Share", labels, values).export_button()

Custom CSS / JS

.inject_css(css: str) -> Chartchainable

Inject extra CSS into the chart's <head>.

chart = sp.bar("X", labels, values).inject_css(".sp-ttl{color:#22c55e}")

.inject_js(js: str) -> Chartchainable

Inject extra JavaScript at the end of the body.

chart = sp.bar("X", labels, values).inject_js("console.log('loaded')")

.show_labels(position="bottom", labels=None, colors=None) -> Chartchainable

Render a clickable text label overlay (alternative legend).

chart = sp.bar("Q", labels, values).show_labels(
    "top", labels=["Series A", "Series B"], colors=["#6366F1", "#FB7185"]
)

Accessibility & CSP

.a11y(title="", desc="") -> Chartchainable

Inject ARIA title and desc for screen readers.

chart = sp.bar("Sales", labels, values).a11y(title="Q1–Q4 revenue", desc="Bar chart showing quarterly revenue trends")

.csp_safe() -> Chartchainable

Move inline scripts to data-* attributes for strict Content-Security-Policy environments.

chart = sp.bar("CSP", labels, values).csp_safe()

.downsample(n=2000, method="lttb") -> Chartchainable

Reduce data points using LTTB (Largest-Triangle-Three-Buckets) for very large series.

chart = sp.line("Big", xs, ys).downsample(n=1000)

Diff & introspection

.diff(other: Chart) -> strchainable

Compare two charts and return a JSON diff describing structural and stylistic differences.

a = sp.bar("v1", labels, vals1)
b = sp.bar("v2", labels, vals2)
print(a.diff(b))

.doc() -> strproperty

Return the full inline documentation for the chart type.

print(chart.doc())

Magic properties

.html # propertyproperty

Read the full HTML payload as a string.

src = chart.html

len(chart) -> intproperty

Returns the size of the HTML payload in bytes.

print(len(chart))

bool(chart) -> boolproperty

True when the chart has rendered output.

if chart:
    chart.show()

Annotations (cross-chart)

SVG overlays inherited by every plot

annotations=[...] (kwarg)newglobal

Pass a list of annotation dicts to any chart builder. Coordinates default to fractional canvas space (0.0 - 1.0); set "frac": false to use raw pixels. Supported kind values: "hline", "vline", "line", "arrow", "rect", "text".

chart = sp.build_line_chart(
    "Sales", labels=months, values=sales,
    annotations=[
        {"kind":"hline", "y":0.5, "color":"#22c55e", "dash":"6 4", "text":"Target"},
        {"kind":"vline", "x":0.62, "color":"#f59e0b", "text":"Launch"},
        {"kind":"rect",  "x":0.05, "y":0.65, "x2":0.40, "y2":0.92,
                         "color":"#6366f1", "fill":"#6366f1", "opacity":0.10},
        {"kind":"arrow", "x":0.45, "y":0.30, "x2":0.85, "y2":0.18, "color":"#ef4444"},
        {"kind":"text",  "x":0.46, "y":0.28, "text":"Outlier", "color":"#ef4444"},
    ],
)

Annotation fields

Every annotation accepts the same shape:

Field	Type	Default	Description
`kind`	str	required	`hline` / `vline` / `line` / `arrow` / `rect` / `text`
`x`, `y`	float	0.5	Anchor point (frac of canvas if `frac=True`, pixels otherwise)
`x2`, `y2`	float	1.0	End point for line / arrow / rect
`color`	str	`"#ef4444"`	Stroke / text color (CSS)
`fill`	str	`"none"`	Fill color (rect only)
`stroke_width`	float	1.5	Stroke width
`dash`	str	`""`	SVG dash array, e.g. `"6 4"`
`opacity`	float	1.0	0.0 - 1.0
`text`	str	None	Optional label rendered next to the primitive
`font_size`	float	11.0	Label font size
`frac`	bool	true	Coordinate space: fractional (0-1) or pixel

Tip: Annotations apply uniformly to every 2D and 3D chart through the apply_annotations() hook - no per-chart wiring required.

Composers (Grid + Slideshow)

Group charts into stories

sp.grid(charts, cols=3, gap=16, bg_color="#0a0f1c", title="", cell_height=None) -> Chartnew

Compose any number of pre-built charts into a responsive CSS-grid layout, each chart hosted in its own iframe. sp.build_grid is an identical alias. cell_height defaults to the chart's own height attribute.

bar  = sp.build_bar_chart("Q-Sales", labels=["Q1","Q2","Q3","Q4"], values=[120,180,150,210])
line = sp.build_line_chart("Trend", labels=months, values=sales)
pie  = sp.build_pie_chart("Mix", labels=["A","B","C"], values=[40,35,25])
grid = sp.grid([bar, line, pie], cols=3, gap=14, title="Dashboard")
grid.show()

sp.build_slideshow(charts, interval_ms=2500, title='', width=900, height=520) -> Chartnew

Build a navigable HTML carousel with previous / next buttons and an auto-advance progress bar - perfect for telling a story without a slide deck.

slides = [sp.build_bar_chart(f"Slide {i+1}", labels=["A","B"], values=[i, i+1]) for i in range(4)]
show = sp.build_slideshow(slides, interval_ms=2200, title="Quarterly Story")
show.show()

Méthodes & configuration globale

Tout objet Chart renvoyé par SeraPlot expose la même API fluide. Définis les valeurs par défaut une fois avec sp.config(), ajuste chart par chart avec des méthodes chaînées. Toutes les méthodes retournent un nouveau Chart : le chaînage est toujours sûr.

API fluideGlobal + override par chart60+ types de graphiquesÉtiquettes Plotly

1Configuration globale 2Thèmes 3Arrière-plan & cadre 4Grille & axes 5Titre & légende 6Typographie 7Étiquettes de valeur 8Style des barres 9Animation & interactivité 10Réactif & mise en page 11Export & téléchargement 12CSS / JS personnalisés 13Accessibilité & CSP 14Diff & introspection 15Propriétés magiques

Configuration globale

Définis les défauts une fois. Tous les graphiques créés ensuite héritent automatiquement de cette configuration.

Paramètre	Type	Défaut	Effet
`font`	str	system	Font family for every text element
`font_size`	int	12	Base font size in px
`title_size`	int	16	Title font size in px
`border_radius`	int	0	Container border radius (px)
`opacity`	float	1.0	Element opacity 0.0–1.0
`responsive`	bool	False	Auto-resize to container width
`animation`	bool	False	Fade-in animation on chart load
`animation_duration`	int	300	Animation duration in ms
`crosshair`	bool	False	Crosshair lines follow mouse hover
`zoom`	bool	False	Mouse wheel zoom + pan (double-click resets)
`tooltip`	str	—	Tooltip mode
`locale`	str	—	Number formatting locale
`thousands_sep`	str	—	Thousands separator character
`margin`	int	0	Container padding (px)
`export_button`	bool	False	Show download button on each chart
`palette`	list[int]	—	Color palette as hex ints (e.g. `[0x6366F1,0xFB7185]`)
`background`	str	—	Background color (any CSS color)
`gridlines`	bool	False	Show grid lines in chart
`text_auto`	bool / str	False	Display values on bars/markers (`True` raw, or d3 format like `".2s"`)
`text_position`	str	"auto"	`"auto"` / `"inside"` / `"outside"`
`text_angle`	int	0	Value label rotation (deg)
`text_font_size`	int	12	Max font size for value labels (px)
`text_font_color`	str	—	Value label color
`uniform_text_min_size`	int	0	Minimum px before label is hidden
`uniform_text_mode`	str	"hide"	`"hide"` small labels or `"show"` overflow
`bar_corner_radius`	int / str	0	Bar corner radius in px or `"20%"` of bar width

sp.config(**kwargs)global

Applique des défauts persistants à tous les charts suivants.

import seraplot as sp
sp.config(
font="Inter", font_size=12, title_size=16,
crosshair=True, zoom=True, animation=True,
palette=[0x6366F1, 0xFB7185, 0x10B981],
background="#fafafa", border_radius=8, margin=16,
)
chart = sp.bar("Sales", ["Q1","Q2","Q3"], [100,150,120])

sp.reset_config()global

Remet chaque paramètre global aux valeurs d'usine.

sp.reset_config()
chart = sp.bar("Clean", labels, values)

Thèmes

Préréglages combinant palette, fond et grille.

Theme	Mood
`"dark"`	Tableau de bord sombre haut contraste
`"light"`	Fond clair pastel doux
`"scientific"`	Style publication monochrome
`"apple"`	Palette inspirée iOS, glassy
`"notion"`	Neutres calmes type Notion
`"minimal"`	Lignes pures, sans décoration
`"neon"`	Néons cyberpunk vibrants

sp.theme(name)global

Applique un thème prédéfini. Cumulable avec sp.config().

sp.theme("dark")
chart = sp.bar("Modern", labels, values)

sp.themes() -> list[str]global

Liste tous les thèmes disponibles.

available = sp.themes()
print(available)

sp.reset_theme()global

Revient à aucun thème (palette par défaut, sans fond, sans grille).

sp.reset_theme()

Arrière-plan & cadre

.set_bg(color=None) -> Chartchainable

Définit le fond du conteneur HTML. Toute couleur CSS ou None pour transparent.

chart = sp.line("Trend", x, y).set_bg("#0f172a")
chart = sp.pie("Share", labels, values).set_bg(None)

.set_frame(color=None) -> Chartchainable

Définit le fond du canvas SVG, indépendant du conteneur HTML.

chart = sp.bar("Title", labels, values).set_frame("transparent")

sp.set_global_background(color)global

Applique un fond à tous les charts créés ensuite. Utile pour les notebooks.

sp.set_global_background("#0f172a")
chart1 = sp.bar(...)
chart2 = sp.scatter(...)
sp.reset_global_background()

Grille & axes

.show_grid() -> Chartchainable

Force la grille active (override config).

chart = sp.bar("Data", labels, values).show_grid()

.hide_grid() -> Chartchainable

Force la grille à OFF.

chart = sp.bar("Data", labels, values, gridlines=True).hide_grid()

.no_x_axis() -> Chartchainable

Supprime l'axe X (ligne, ticks, labels).

chart = sp.bar("Y only", labels, values).no_x_axis()

.no_y_axis() -> Chartchainable

Supprime l'axe Y (ligne, ticks, labels).

chart = sp.bar("X only", labels, values).no_y_axis()

.no_axes() -> Chartchainable

Supprime les deux axes en même temps.

chart = sp.scatter("Clean", x, y).no_axes()

Titre & légende

.no_title() -> Chartchainable

Masque le titre.

chart = sp.pie("Internal", labels, values).no_title()

.no_legend() -> Chartchainable

Masque la légende (charts multi-séries).

chart = sp.grouped_bar("Q1", cats, series).no_legend()

.title_size(px: int) -> Chartchainable

Override la taille du titre pour ce chart.

chart = sp.bar("Big", labels, values).title_size(24)

Typographie

.font(name: str) -> Chartchainable

Override la police pour ce chart.

chart = sp.bar("Roboto", labels, values).font("Roboto")

.set_font_size(px: int) -> Chartchainable

Override la taille de base de tous les labels.

chart = sp.radar("Skills", labels, values).set_font_size(11)

.text_font(family=None, size=None, color=None) -> Chartchainable

Style les étiquettes de valeur (famille text_auto).

chart = sp.bar("Styled", labels, values).text_font(family="Courier", size=11, color="#333")

Étiquettes de valeur

Astuce : fonctionne sur tous les charts qui exposent data-v — barres, lollipops, scatter, pie, treemap, marqueurs de ligne… Les formats suivent d3 / Plotly : ".2s", ".0f", ".1%".

.text_auto(format=True, position=None, angle=None, font_size=None, color=None) -> Chartchainable

Affiche les valeurs sur chaque point. format=True = brut ; passe un format d3 pour personnaliser.

chart = sp.bar("Raw", labels, values).text_auto(True)
chart = sp.pie("Pct", labels, values).text_auto(".1%", position="outside")
chart = sp.bar("SI", labels, values).text_auto(".2s", angle=45, font_size=13)

.text_position(position: str) -> Chartchainable

Override la position : "auto", "inside", "outside".

chart = sp.bar("Out", labels, values).text_position("outside")

.text_angle(degrees: int) -> Chartchainable

Tourne les étiquettes de N degrés.

chart = sp.bar("Rot", labels, values).text_angle(90)

.uniform_text(min_size=8, mode="hide") -> Chartchainable

Force une taille uniforme. mode="hide" masque les labels < min_size ; "show" autorise l'overflow.

chart = sp.bar("Uniform", labels, values).uniform_text(min_size=10, mode="hide")

Style des barres

.corner_radius_bars(radius) -> Chartchainable

Arrondit les coins. Entier (pixels) ou chaîne type "20%" de la largeur de barre.

chart = sp.bar("Modern", labels, values).corner_radius_bars(8)
chart = sp.bar("Pct", labels, values).corner_radius_bars("15%")

Animation & interactivité

.animate(duration=300) -> Chartchainable

Animation fade-in. Durée en ms.

chart = sp.bar("Fade", labels, values).animate(500)

.crosshair() -> Chartchainable

Lignes crosshair qui suivent la souris.

chart = sp.scatter("XY", x, y).crosshair()

.zoom() -> Chartchainable

Zoom molette + pan ; double-clic = reset.

chart = sp.line("Big", x, y).zoom()

.no_hover() -> Chartchainable

Désactive les effets hover et les tooltips.

chart = sp.bar("Static", labels, values).no_hover()

Réactif & mise en page

.responsive() -> Chartchainable

Redimensionnement auto sur la largeur parent.

chart = sp.bar("Fluid", labels, values).responsive()

.border_radius(px: int) -> Chartchainable

Définit le rayon des coins du conteneur.

chart = sp.bar("Round", labels, values).border_radius(12)

.set_margin(px: int) -> Chartchainable

Définit le padding du conteneur.

chart = sp.scatter("Pad", x, y).set_margin(20)

.set_opacity(value: float) -> Chartchainable

Opacité des éléments (0.0–1.0).

chart = sp.bar("Faded", labels, values).set_opacity(0.7)

.scale(factor: float) -> Chartchainable

Mise à l'échelle (1.0 = normal).

chart = sp.pie("Big", labels, values).scale(1.5)

Export & téléchargement

.save(path: str)export

Écrit le HTML du chart sur disque.

chart.save("chart.html")

.show()export

Affiche dans Jupyter via IPython.display.

sp.scatter("Data", x, y).show()

.to_svg() -> strexport

Renvoie l'élément <svg> sous forme de chaîne.

svg = chart.to_svg()

.export_svg(path: str)export

Sauve la partie SVG sur disque.

chart.export_svg("chart.svg")

.export_png(path: str, scale=2.0)export

Export PNG (nécessite cairosvg).

chart.export_png("chart.png", scale=1.5)

.export_button() -> Chartchainable

Ajoute un bouton de téléchargement.

chart = sp.pie("Share", labels, values).export_button()

CSS / JS personnalisés

.inject_css(css: str) -> Chartchainable

Injecte du CSS dans le <head> du chart.

chart = sp.bar("X", labels, values).inject_css(".sp-ttl{color:#22c55e}")

.inject_js(js: str) -> Chartchainable

Injecte du JavaScript en fin de body.

chart = sp.bar("X", labels, values).inject_js("console.log('loaded')")

.show_labels(position="bottom", labels=None, colors=None) -> Chartchainable

Ajoute des étiquettes textuelles cliquables (légende alternative).

chart = sp.bar("Q", labels, values).show_labels(
    "top", labels=["Series A", "Series B"], colors=["#6366F1", "#FB7185"]
)

Accessibilité & CSP

.a11y(title="", desc="") -> Chartchainable

Ajoute title et desc ARIA pour les lecteurs d'écran.

chart = sp.bar("Sales", labels, values).a11y(title="Q1–Q4 revenue", desc="Bar chart showing quarterly revenue trends")

.csp_safe() -> Chartchainable

Déplace les scripts inline en attributs data-* pour les environnements CSP strict.

chart = sp.bar("CSP", labels, values).csp_safe()

.downsample(n=2000, method="lttb") -> Chartchainable

Réduit le nombre de points avec LTTB (Largest-Triangle-Three-Buckets) pour les grosses séries.

chart = sp.line("Big", xs, ys).downsample(n=1000)

Diff & introspection

.diff(other: Chart) -> strchainable

Compare deux charts et renvoie un diff JSON décrivant les différences.

a = sp.bar("v1", labels, vals1)
b = sp.bar("v2", labels, vals2)
print(a.diff(b))

.doc() -> strproperty

Renvoie la documentation inline complète du type de chart.

print(chart.doc())

Propriétés magiques

.html # propertyproperty

Lit le HTML complet sous forme de chaîne.

src = chart.html

len(chart) -> intproperty

Renvoie la taille du HTML en octets.

print(len(chart))

bool(chart) -> boolproperty

True si le chart a un rendu.

if chart:
    chart.show()

Annotations (transversales)

Surcouches SVG heritees par tous les plots

annotations=[...] (kwarg)nouveauglobal

Passe une liste de dictionnaires d annotations a n importe quel builder. Coordonnees fractionnaires par defaut (0.0 - 1.0) ; mets "frac": false pour utiliser des pixels. Valeurs supportees pour kind : "hline", "vline", "line", "arrow", "rect", "text".

chart = sp.build_line_chart(
    "Ventes", labels=mois, values=ventes,
    annotations=[
        {"kind":"hline", "y":0.5, "color":"#22c55e", "dash":"6 4", "text":"Cible"},
        {"kind":"vline", "x":0.62, "color":"#f59e0b", "text":"Lancement"},
        {"kind":"rect",  "x":0.05, "y":0.65, "x2":0.40, "y2":0.92,
                         "color":"#6366f1", "fill":"#6366f1", "opacity":0.10},
        {"kind":"arrow", "x":0.45, "y":0.30, "x2":0.85, "y2":0.18, "color":"#ef4444"},
        {"kind":"text",  "x":0.46, "y":0.28, "text":"Outlier", "color":"#ef4444"},
    ],
)

Champs d annotation

Toutes les annotations partagent la meme structure :

Champ	Type	Defaut	Description
`kind`	str	requis	`hline` / `vline` / `line` / `arrow` / `rect` / `text`
`x`, `y`	float	0.5	Point d ancrage (frac canvas si `frac=True`, pixels sinon)
`x2`, `y2`	float	1.0	Point final pour line / arrow / rect
`color`	str	`"#ef4444"`	Couleur de trait / texte (CSS)
`fill`	str	`"none"`	Couleur de remplissage (rect uniquement)
`stroke_width`	float	1.5	Epaisseur du trait
`dash`	str	`""`	SVG dash array, ex. `"6 4"`
`opacity`	float	1.0	0.0 - 1.0
`text`	str	None	Etiquette optionnelle a cote du primitif
`font_size`	float	11.0	Taille de la police de l etiquette
`frac`	bool	true	Espace de coordonnees : fractionnaire (0-1) ou pixel

Astuce : les annotations s appliquent uniformement a tous les charts 2D et 3D via le hook apply_annotations() - aucun branchement par chart requis.

Composers (Grid + Slideshow)

Regroupe des charts en histoires

sp.grid(charts, cols=3, gap=16, bg_color="#0a0f1c", title="", cell_height=None) -> Chartnouveau

Empile N charts deja construits dans une grille CSS responsive, chaque chart isole dans son iframe. sp.build_grid est un alias identique. cell_height utilise par defaut la hauteur detectee dans le chart.

bar  = sp.build_bar_chart("Ventes-Q", labels=["Q1","Q2","Q3","Q4"], values=[120,180,150,210])
line = sp.build_line_chart("Tendance", labels=mois, values=ventes)
pie  = sp.build_pie_chart("Mix", labels=["A","B","C"], values=[40,35,25])
grid = sp.grid([bar, line, pie], cols=3, gap=14, title="Tableau de bord")
grid.show()

sp.build_slideshow(charts, interval_ms=2500, title='', width=900, height=520) -> Chartnouveau

Construit un carrousel HTML navigable avec boutons precedent/suivant et barre de progression - parfait pour raconter une histoire sans presentation externe.

slides = [sp.build_bar_chart(f"Slide {i+1}", labels=["A","B"], values=[i, i+1]) for i in range(4)]
show = sp.build_slideshow(slides, interval_ms=2200, title="Histoire trimestrielle")
show.show()

Keyboard shortcuts

SeraPlot Documentation