Themes

The default — patternfly

The Alpine factory registers a single global ECharts theme called patternfly on script load. Every phaChart call defaults to it — you don't need to opt in. The theme defines:

• The 10-step PF colour palette (see Colors for charts)
• Red Hat Text font family, with PF-aligned text colours
• Subtle grey axis lines and tick marks, with a light grid
• White tooltip background with a 1px PF-grey border

Same data, default theme

Registering a custom theme

Themes are ordinary ECharts theme objects. Register one at script-load time and reference it by name in the factory call:

echarts.registerTheme('dark', {
  backgroundColor: '#1b1d21',
  textStyle: { color: '#f0f0f0' },
  color: ['#73bcf7', '#7cc674', '#73c5c5', '#f6d173', '#ef9234']
});

// Use it:
<div x-data="phaChart({ theme: 'dark', option: { ... } })">

Per-chart override

A theme can also be passed inline as an object via the theme config key — handy for quick experiments without polluting the global registry.