Close Menu
Home
Getting Started
Visual Language
Color
Typography
Iconography
Space
Borders
Layering
Constants
Libraries
UI Components
Component Status
Accordions
Alerts
Buttons
Button Groups
Cards
Checkboxes
Combo Boxes
Data Tables
Dialogs
Field Errors
Forms
Headers
Icons
Inputs
Labels
Layout Grid
Links
List Groups
Loaders
Mastheads
Menus
Microcopy
Modals
Module Containers
Navigation Containers
Notifications
Page Shells
Pagination
Popovers
Radio Buttons
Range Sliders
Required Fields Key
Search Fields
Selects
Site Navigation
Steppers
Switches
Tags
Textareas
Tooltips
Top Hats
Charts
Getting Started
Choosing a Chart
Visual Language
Bubble
Correlation Matrix
Donut
Geographical Map
Horizontal Bar
Line
Market Barometer
Scatter Plot
Style Box
Style Map
Time-Series Line
Vertical Bar
Release History
Editorial
Voice Principles
Message-Design Framework
Punctuation
UX Patterns
Getting Started
Errors
Navigation
Search
About MDS
Release History
Report a Bug
Request a New Part
Development
Overview
AVR Testing
Building a Component
Coding Standards
Javascript in MDS
MDSWC Base API
Publishing Documentation
Running Local Environment
Unit Testing
Versioning & Breaking Changes
Contributions
Overview
Proposing a Contribution
Segments
Adoption
Overview
v2.0.0 Upgrade Guide
Migrating from MUI-B
Design Handoff to Development
Browser Support
Accessibility
Choosing a Chart
Each data relationship can be best served by a particular subset of charts.
Comparison
Static
Horizontal Bar
Vertical Bar
Grouped Bar
Stacked Bar
Over Time
Few Categories or Periods
Vertical Bar
Grouped Bar
Stacked Bar
Line
Many Categories or Periods
Time-Series Line
(e.g., Performance or Growth)
Composition
Static
Donut
(e.g., Allocation)
Horizontal Bar
(e.g., Long/Short Allocation)
Over Time
Stacked Bar
Relationship & Distribution
Two Variables
Scatter Plot
(e.g., Risk/Reward Analysis)
Three Variables
Bubble
(e.g., Weighted Portfolio Holdings)
Link Template