DevTools · Sẵn sàng cho AI · Mã nguồn mở
Engine biểu đồ độc lập framework: DevTools tích hợp sẵn, ChartContext cho AI đọc trên mọi biểu đồ, và một API TypeScript duy nhất cho SVG, Canvas lẫn WebGPU - dùng với React, Vue, Svelte, Angular hay web component thuần.
Một bảng DevTools thực thụ: trạng thái trực tiếp, bố cục, kết xuất và kiểm tra vùng chạm, so sánh giữa các lần render, đo hiệu năng và kiểm toán khả năng truy cập.
Mỗi biểu đồ phát ra một ChartContext có cấu trúc - bản tóm tắt bằng ngôn ngữ tự nhiên mà một tác nhân AI có thể đọc và điều khiển qua MCP.
Chính ngữ cảnh đó là một phương án thay thế bằng văn bản thực sự cho trình đọc màn hình. Tích hợp sẵn, không phải chắp vá.
Dự báo, phát hiện bất thường và thuyết minh chạy ngay trong trình duyệt. Không máy chủ, không tải lên. Giấy phép MIT.
Every block below is a real michi-vz chart (a line, a scatter, a radar, an area), fed data until it turned into Michi, our cat in Geneva. The serious reasons start right below.
Seventeen chart types, from stacked bars to gap charts to the fountain, drawn by one engine. Here are the six ideas michi-vz cares about most, each one a live chart, not a screenshot.
The sentence beside this chart was written by the chart itself. Every michi-vz chart emits a structured ChartContext that an AI agent can query, a screen reader can speak, and a test can assert on. Pixels for people, structure for everything else.
How machines read these charts →Trải nghiệm lập trình viên là cốt lõi
Dựng biểu đồ trong vài phút, kiểm tra chúng trong vài giây, và mở rộng từ nguyên mẫu đến sản xuất trên cùng một API. Chọn biểu đồ theo câu hỏi bạn đang đặt ra - mỗi thẻ là một thành phần trực tiếp trên dữ liệu thật.
Trends over time across one or many series. The dashed run is a gap in the data (detectGaps).
A forecast fan: history, a dashed forecast median, and nested confidence bands that widen with the horizon.
Part to whole over time: how each component's share of a stacked total shifts.
The relationship between two numeric variables; bubble size encodes a third.
Min to max bands per series: forecasts, confidence intervals, or observed ranges.
Stacked columns per period, linked by ribbons that trace each category over time.
Compare several entities across a shared set of axes at a glance.
Stacked vertical bars per category, with an explicit missing-data guard.
Two overlaid horizontal sub-bars per label: a based vs compared value.
Two full-bandwidth overlapping columns per category, with a change arrow above each pair - the vertical sibling of Comparable Bar.
Diverging bars from a centre line: population pyramids and tornado charts.
Cumulative horizontal segments per row with end-cap circles at each step.
Two values per label joined by a gap bar that emphasises the difference.
Hierarchical tiles sized by value; each splits into two parts (e.g. realized vs untapped). Falls back to a stack on narrow screens.
Slices sized by share of a whole; set innerRadiusRatio for a donut. Per-slice % labels and an optional legend.
Circles sized by value, pulled into a cluster by gravity; each can split into a realized core inside a lighter untapped ring.
Flows between nodes laid out in columns; each band's thickness is the flow value. Built on d3-sankey.
A Jet d'Eau: apex height is the value, the blooming plume is the uncertainty. Categorical x = snapshot/comparison, temporal x = trend.
A world/region choropleth: your own GeoJSON, shaded by a threshold colour scale or an explicit category map. 13 d3-geo/d3-geo-projection projections.
A force-de-overlapped bubble map: you supply lng/lat per item, a one-shot simulation pulls overlapping circles apart. An optional muted backdrop landmass is available; dot-only by default.
A radial cluster()/dendrogram: leaves sit equidistant from the centre, with circles sized at both the group and leaf level. Labels adapt (abbreviate, rotate, or hide) as leaf density grows.
