dash-mui-charts — MUI X charts for Dash
Interactive MUI X charts, tree views and time pickers for Plotly Dash.
13 components · full Python type hints · clicks, zoom, selection and edits as Dash callbacks · dark mode · Community and Pro tiers.
Documentation · Discord · YouTube · GitHub
Maintained by Pip Install Python LLC.
Overview
dash-mui-charts wraps MUI X Charts, MUI X Tree View and the MUI X Date & Time Pickers' TimeClock as first-class Dash components. Author charts in Python, and get every interaction back as a callback property.
- 13 components — nine chart types, three tree views, and a clock-face time picker.
- Callbacks-first —
clickData,axisClickData,highlightedItem,hoverIndex,zoomData, selection and edit events all arrive as Dash inputs; controlled props (highlightedItem,expandedItems,value, …) work in both directions for synchronized, cross-chart UIs. - Dark mode by construction — components watch the Mantine color-scheme attribute and re-theme live.
- Functions-as-props — axis
valueFormatterand alert formatters accept{'function': 'name', 'options': {...}}resolved from a JS registry, mirroring the dash-mantine-components pattern. - Community and Pro tiers — Community features need no license; zoom/pan, sliders, toolbars, brush, Heatmap and TreeViewPro extras light up with a MUI X Pro license key.
Installation
pip install dash-mui-charts
Requires dash>=3.3. See Dash compatibility for the tested matrix.
Quick Start
from dash import Dash, html
from dash_mui_charts import LineChart, PieChart
app = Dash(__name__)
app.layout = html.Div([
LineChart(
series=[
{'data': [2, 5, 3, 8, 1, 9], 'label': 'Sales'},
{'data': [1, 3, 2, 5, 4, 6], 'label': 'Costs'},
],
xAxis=[{'data': ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'], 'scaleType': 'band'}],
height=300,
),
PieChart(
data=[
{'id': 0, 'value': 35, 'label': 'Marketing'},
{'id': 1, 'value': 25, 'label': 'Engineering'},
{'id': 2, 'value': 20, 'label': 'Sales'},
{'id': 3, 'value': 20, 'label': 'Support'},
],
height=300,
),
])
if __name__ == '__main__':
app.run(debug=True)
Documentation
📚 muicharts.2plot.dev
41 pages of live, interactive examples — every chart family with working callbacks, two props playgrounds, and an API reference whose props tables are generated from the components' own metadata. Every docs page also serves an LLM-friendly version at /<page>/llms.txt.
Run it locally:
git clone https://github.com/pip-install-python/dash-mui-charts.git
cd dash-mui-charts
pip install -r requirements.txt
# markdown2dash pins gunicorn<22, against the CVE-driven gunicorn>=23 floor in
# requirements.txt. pip cannot resolve both, so it installs without its
# dependency graph — every one of them is in requirements.txt already.
pip install --no-deps markdown2dash==0.1.2
pip install -e .
python run.py # http://127.0.0.1:7666
Components
| Component | Category | What it is | Tier |
|---|---|---|---|
LineChart |
Charts | Line/area charts, biaxial axes, reference lines, zoom/pan, brush | Community / Pro |
BarChart |
Charts | Vertical/horizontal bars, stacking, bar labels, dataset mode, zoom | Community / Pro |
CandlestickChart |
Charts | OHLC candlesticks with volume overlay and reference lines | Community / Pro |
PieChart |
Charts | Pie, donut, and nested pies with controlled highlighting | Community |
ScatterChart |
Charts | Scatter plots, z-axis color mapping, voronoi interaction | Community |
CompositeChart |
Charts | Scatter + line series layered on one surface, multi-axis | Community / Pro |
Heatmap |
Charts | Matrix visualization with continuous/piecewise color scales | Pro |
SparklineChart |
Charts | Compact inline charts for dashboards, KPI cards and tables | Community |
LiveTradingChart |
Charts | Real-time streaming OHLCV simulation with forecast and alerts | Community / Pro |
TreeView |
Trees | Data-driven RichTreeView: selection, expansion, inline label editing | Community |
SimpleTreeView |
Trees | JSX-driven tree for navigation sidebars and static hierarchies | Community |
TreeViewPro |
Trees | Drag-reorder, lazy loading, per-item slider and kebab controls | Pro |
TimeClock |
Pickers | Inline clock-face time picker | Community |
MUI X Pro licensing
dash-mui-charts itself is MIT. Pro-tier features run on MUI X Pro, which requires a commercial license from MUI — pass your key to any component via the licenseKey prop:
import os
from dash_mui_charts import BarChart
BarChart(
licenseKey=os.environ['MUI_PRO_API_KEY'],
series=[...],
xAxis=[{'data': [...], 'scaleType': 'band', 'zoom': {'minSpan': 8}}],
showSlider=True, # Pro: zoom slider
)
Without a key, Pro features render with MUI's unlicensed watermark — components degrade, they never crash. Community features never need a key.
API reference
The /api page lists every prop of all 13 components, generated from the components' own metadata so it always matches the installed version. The props you will meet everywhere:
| Prop | Type | Description |
|---|---|---|
id |
str | Dash callback identity — available on every component |
licenseKey |
str | MUI X Pro key — enables Pro features per component |
clickData / axisClickData |
dict | Callback outputs: what was clicked, with series/axis context |
highlightedItem |
dict | Controlled highlight — works as callback input AND output |
hoverIndex / hoverValue |
— | Sparkline hover stream for synchronized displays |
selectedItems / expandedItems |
— | Tree selection/expansion — controlled or uncontrolled |
sx |
dict | MUI system styling passed straight to the underlying component |
Dash compatibility
The package targets Dash 3.3 and up; the documentation site needs Dash 4.1+ (its llms.txt engine pins dash>=4.1). Both floors are verified, not assumed, in GitHub Actions on every push and PR:
- the docs site boots and smoke-tests on Dash 4.1.0 / 4.2.0 / 4.3.0 / 4.4.1 (Python 3.10–3.13), rebuilding the component bundle and Python wrappers from source in each cell;
- the wheel installs into a clean venv with nothing but Dash present on Python 3.9 → 3.13, plus a dedicated
dash==3.3.0floor install; - the production Docker image is built, booted secretless, and probed by the same network battery that checks the live site after every deploy.
python scripts/smoke_test.py # the per-version harness, standalone
Development
git clone https://github.com/pip-install-python/dash-mui-charts.git
cd dash-mui-charts
# JS toolchain (only needed when changing src/lib/components)
npm install
npm run build # webpack bundle + regenerated Python wrappers
npm run validate-init # all 13 components generated and importable
# Python
pip install -r requirements.txt
pip install --no-deps markdown2dash==0.1.2 # pins gunicorn<22; see above
pip install -e .
python run.py # docs on :7666
# Test
pytest tests/ # 80 checks, zero secrets by design
python scripts/smoke_test.py # routes, layouts, JS parse
python scripts/route_parity.py --charts-only # every live example, id and callback intact
python scripts/check_release.py # version drift, stale bundle, packaging
# Build a distribution
python -m build
The React sources in src/lib/components/*.react.js are the source of truth — the Python classes in dash_mui_charts/ are generated from their PropTypes by dash-generate-components. The built bundle and wrappers are committed so git-based deploys (Render) work without a node toolchain.
After editing src/lib/components/*.react.js you must run npm run build and commit the regenerated bundle and wrappers in the same commit — check_release.py compares git commit timestamps and flags a bundle older than its source. The version lives in two files: package.json (which setup.py reads) and dash_mui_charts/package-info.json (which __version__ reads, regenerated by the build); check_release.py fails if they drift.
Releasing
Tag-driven. git tag -a vX.Y.Z && git push origin vX.Y.Z runs release.yml: it asserts the tag matches package.json, re-runs the consistency and smoke checks, builds, publishes to PyPI over OIDC trusted publishing (no API token stored anywhere), and opens a GitHub Release with that version's CHANGELOG section attached. A workflow_dispatch dry run publishes to TestPyPI instead.
Deployment
The documentation site runs at muicharts.2plot.dev on Render. The repo ships a render.yaml blueprint and Dockerfile — create a Render Blueprint from the repo, fill the sync: false secrets in the dashboard, point the muicharts.2plot.dev CNAME at the service, and it auto-deploys on push to main with a /healthz health check.
The canonical origin lives in exactly one place — DEFAULT_BASE_URL in lib/constants.py (override per-environment with APP_BASE_URL). templates/index.html carries __CANONICAL_ORIGIN__ tokens that run.py substitutes at startup, so the canonical link, og:url, the JSON-LD, sitemap.xml, robots.txt and the llms.txt links cannot drift apart.
Requirements
- Python >= 3.9 (the documentation site itself needs >= 3.10 — see below)
- Dash >= 3.3 (the documentation site needs >= 4.1)
- Node.js >= 18 — only to rebuild the JS bundle
- A MUI X Pro license — only for Pro-tier features
The package needs only Python 3.9+ and Dash 3.3+; that range is verified in CI. Running the documentation site from source additionally needs Python 3.10+ (python-frontmatter imports typing.TypeGuard) and Dash 4.1+. Neither floor applies to pip install dash-mui-charts.
Community & support
- 💬 Discord — questions and showcase
- ▶️ YouTube @2plotai — tutorials
- 🐛 GitHub Issues — bugs and feature requests
Come build with us.
More from Pip Install Python LLC
dash-mui-charts is one of several tools built and maintained by Pip Install Python LLC:
| Project | What it is |
|---|---|
| 📊 2plot.ai | The network hub — data apps, analytics, sign-in |
| 🎬 2plot.media | Videography application |
| 🧩 2plot.dev | The full Dash component catalogue |
| 🤖 ai-agent.buzz | Infinite AI canvas |
| ⛵️ PiratesBargain | E-commerce / digital commerce |
License
MIT — see LICENSE. dash-mui-charts is an independent Dash wrapper around MUI X, which is its own project under its own licenses: the Community features wrap MIT-licensed MUI X packages, and Pro-tier features require your own commercial MUI X license. Built by Pip Install Python.
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Filter files by name, interpreter, ABI, and platform.
If you're not sure about the file name format, learn more about wheel file names.
Copy a direct link to the current filters
File details
Details for the file dash_mui_charts-1.4.0.tar.gz.
File metadata
- Download URL: dash_mui_charts-1.4.0.tar.gz
- Upload date:
- Size: 1.6 MB
- Tags: Source
- Uploaded using Trusted Publishing? Yes
- Uploaded via:
twine/7.0.0 CPython/3.13.14
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
48cb7cf395fc593a3ce935f78d58314b9d3bca72382ea21411d71f13157d20c1
|
|
| MD5 |
c7add5c8407cc471f4b0fce530e65659
|
|
| BLAKE2b-256 |
ca13049003452c96e5af9e033c850b036311e387c046c62367691470162fcf1d
|
Provenance
The following attestation bundles were made for dash_mui_charts-1.4.0.tar.gz:
Publisher:
release.yml on pip-install-python/dash-mui-charts
-
Statement:
-
Statement type:
https://in-toto.io/Statement/v1 -
Predicate type:
https://docs.pypi.org/attestations/publish/v1 -
Subject name:
dash_mui_charts-1.4.0.tar.gz -
Subject digest:
48cb7cf395fc593a3ce935f78d58314b9d3bca72382ea21411d71f13157d20c1 - Sigstore transparency entry: 2335499953
- Sigstore integration time:
-
Permalink:
pip-install-python/dash-mui-charts@92d64dd45b3f40d8fcce844704477ca093fbc58d -
Branch / Tag:
refs/tags/v1.4.0 - Owner: https://github.com/pip-install-python
-
Access:
public
-
Token Issuer:
https://token.actions.githubusercontent.com -
Runner Environment:
github-hosted -
Publication workflow:
release.yml@92d64dd45b3f40d8fcce844704477ca093fbc58d -
Trigger Event:
push
-
Statement type:
File details
Details for the file dash_mui_charts-1.4.0-py3-none-any.whl.
File metadata
- Download URL: dash_mui_charts-1.4.0-py3-none-any.whl
- Upload date:
- Size: 1.6 MB
- Tags: Python 3
- Uploaded using Trusted Publishing? Yes
- Uploaded via:
twine/7.0.0 CPython/3.13.14
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
ba71eaa079cf1217530eff2226397f9a8853cbc3c1d2cfb0b15d6a20bcf20ae5
|
|
| MD5 |
34e1de22fec5998604d0fb784057f361
|
|
| BLAKE2b-256 |
53d1c9b623031fb846dfd46736ad99258b15497a42fac8280f896fe5de12dbea
|
Provenance
The following attestation bundles were made for dash_mui_charts-1.4.0-py3-none-any.whl:
Publisher:
release.yml on pip-install-python/dash-mui-charts
-
Statement:
-
Statement type:
https://in-toto.io/Statement/v1 -
Predicate type:
https://docs.pypi.org/attestations/publish/v1 -
Subject name:
dash_mui_charts-1.4.0-py3-none-any.whl -
Subject digest:
ba71eaa079cf1217530eff2226397f9a8853cbc3c1d2cfb0b15d6a20bcf20ae5 - Sigstore transparency entry: 2335499989
- Sigstore integration time:
-
Permalink:
pip-install-python/dash-mui-charts@92d64dd45b3f40d8fcce844704477ca093fbc58d -
Branch / Tag:
refs/tags/v1.4.0 - Owner: https://github.com/pip-install-python
-
Access:
public
-
Token Issuer:
https://token.actions.githubusercontent.com -
Runner Environment:
github-hosted -
Publication workflow:
release.yml@92d64dd45b3f40d8fcce844704477ca093fbc58d -
Trigger Event:
push
-
Statement type: