reactor-charts

Create declarative WinUI Reactor charts with a fluent DSL.

609|44|Updated Apr 16, 2026
One-click install
npx skills add https://github.com/microsoft/microsoft-ui-reactor --skill reactor-charts
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: reactor-charts
Source: https://github.com/microsoft/microsoft-ui-reactor/tree/main/plugins/reactor/skills/reactor-charts
Command: npx skills add https://github.com/microsoft/microsoft-ui-reactor --skill reactor-charts

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Reactor Charts enables WinUI developers to build and customize complex charts with a declarative DSL and accessible defaults, reducing boilerplate and wiring between data and visuals.

Core Features & Use Cases

  • Declarative API for Chart types (LineChart, BarChart, AreaChart, PieChart, TreeChart, ForceGraph) with fluent customization of axes, labels, palettes, and sizing.
  • Built-in direct labeling and *View extensions for custom labels, icons, and multi-line content, plus an accessibility surface via IChartAccessibilityData.
  • Real-world scenarios include dashboards, analytics pages, and data-rich UIs where visuals must be accessible, responsive, and themeable.

Quick Start

Create a BarChart from your dataset and tune axes using the built-in chart DSL.

Frequently Asked Questions about reactor-charts

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create declarative charts in WinUI to reduce boilerplate?

Declarative charts in WinUI use a fluent DSL to define chart types, axes, and labels, reducing boilerplate between data and visuals. You configure LineChart, BarChart, AreaChart, PieChart, TreeChart, and ForceGraph directly through extension methods.

Can I add custom icons and multi-line content to WinUI chart labels?

Custom icons and multi-line content can be added to WinUI chart labels using *View extensions. These extensions allow you to build custom labels and visual elements beyond standard text, providing flexible data labeling directly on the chart.

How do I make data visualization accessible in a WinUI application?

Data visualization is made accessible by implementing the IChartAccessibilityData surface, which exposes chart data to assistive technologies. This built-in accessibility surface ensures dashboards and analytics pages meet accessibility requirements.

Does WinUI Reactor support force-directed graphs and tree charts?

WinUI Reactor supports both ForceGraph and TreeChart types alongside LineChart, BarChart, AreaChart, and PieChart. You declare these complex visualizations using the same fluent DSL and customize them with axes, palettes, and sizing options.

What is the best way to label data points versus using tooltips in WinUI charts?

Direct labeling is preferred for immediate readability, while tooltips and legends provide supplementary details. The chart DSL includes built-in direct labeling features and guidance on when to apply direct labels versus legends or tooltips for optimal data communication.

Are declarative charts suitable for building responsive dashboards in WinUI?

Declarative charts are suitable for responsive dashboards, analytics pages, and data-rich UIs. The fluent API allows customization of palettes and sizing, ensuring visuals remain accessible, responsive, and themeable across different display contexts.