Skip to main content
Elastic UI
Elastic UI
ComponentsPatternsContentData visualization
EUI ChangelogGitHubFigma
  • Elastic Charts as a design system
  • Dashboard good practices
  • Accessibility features
  • Types
    • Categorical
    • Metric chart
    • Time series
    • Part to whole comparisons
  • Sizing
  • Theming
  • EUI
  • Types
  • Categorical
@elastic/charts v68.0.2

Categorical

Categorical charts compare data between multiple distinct categories. Avoid using a line chart because it might create confusion with a time series chart. Use a bar chart instead.

Key configurations

  • Settings.rotation = 90
  • BarSeries.data = orderBy(DATASET, ['count'], ['desc'])
  • BarSeries.xAccessor = "vizType"
  • Axis.tickFormat = (d => Number(d)'k')

Edit this page
Previous
Accessibility features
Next
Metric chart
EUI is dual-licensed under Elastic License 2.0 and Server Side Public License, v 1 | Crafted with ❤ by Elastic