browser_plotter Module#

Browser export utilities for Episia.

This module provides convenience functions for exporting Plotly figures to HTML and JSON formats for web integration.

Functions#

episia.viz.plotters.browser_plotter.save_html(fig, path, title='Episia Figure', include_plotlyjs=True, full_html=True)[source]#

Export a Plotly figure as a standalone HTML file.

Parameters:

  • fig (Any) – plotly.graph_objects.Figure instance.

  • path (str) – Destination path (.html appended if missing).

  • title (str) – HTML page <title>.

  • include_plotlyjs (bool) – Embed plotly.js bundle (larger file, fully offline). Set False to load from CDN (smaller, needs internet).

  • full_html (bool) – Wrap in full <html> document (True) or div only (False).

Returns:

Absolute path to the written file.

Return type:

str

episia.viz.plotters.browser_plotter.to_react_props(fig)[source]#

Serialize a Plotly figure into props for react-plotly.js <Plot />.

Returns a dict with keys:

“data” list of trace dicts “layout” layout dict “config” recommended config dict

Usage in React:

import Plot from 'react-plotly.js';
const props = await fetchEpisiaProps('/api/plot/epicurve');
<Plot data={props.data} layout={props.layout} config={props.config} />
Parameters:

fig (Any) – plotly.graph_objects.Figure instance.

Returns:

Dict with “data”, “layout”, “config”.

Return type:

Dict[str, Any]

episia.viz.plotters.browser_plotter.to_json(fig, indent=None)[source]#

Serialize a Plotly figure to a JSON string.

Useful for REST API responses or caching.

Parameters:

  • fig (Any) – plotly.graph_objects.Figure instance.

  • indent (int | None) – JSON indentation (None for compact).

Returns:

JSON string.

Return type:

str

Examples#

Export to standalone HTML:

from episia.viz.plotters.browser_plotter import save_html

fig = plotter.plot_model(result)
path = save_html(
    fig,
    "covid_model.html",
    title="COVID-19 SEIR Model",
    include_plotlyjs=True  # Embed plotly.js (offline capable)
)

React integration:

from episia.viz.plotters.browser_plotter import to_react_props

# In Python backend
fig = plotter.plot_epicurve(result)
props = to_react_props(fig)

# Send to React frontend (e.g., via JSON API)
import json
response = json.dumps(props)

# In React component:
# <Plot data={props.data} layout={props.layout} config={props.config} />

JSON serialization:

from episia.viz.plotters.browser_plotter import to_json

# For caching or API responses
json_str = to_json(fig, indent=2)  # Pretty printed

# Store in database or send to client
with open("figure_cache.json", "w") as f:
    f.write(json_str)