Visualizations
Chart and table components for rendering analytics data.
GoodData.UI provides React components that render data from the GoodData analytics engine. The chart family in @gooddata/sdk-ui-charts covers the common analytical shapes: bar, column, line, area, combo, pie, donut, scatter, bubble, funnel, pyramid, heatmap, treemap, sankey, dependency wheel, waterfall, bullet, Mekko, radar, and headline. Each chart takes measures, attributes to view or stack by, and a filters array.
If you already have saved visualizations in your workspace, use InsightView. It renders a saved visualization by its identifier, picks the right chart type, and keeps the configuration it was saved with. For tables, use Pivot table. For list-style rows with inline charts, use Repeater. For maps, use the geo charts. Every chart accepts a shared chart configuration object for colors, legends, axes, and data labels, and Charts and plots explains the behavior all of them share.
Pick the component that matches the shape of your data: bar, column, or pie charts for categorical comparisons; line, area, or combo charts for trends over time; headlines and bullet charts for single values against targets; pivot tables for tabular breakdowns; and the geo charts for geographic data.
Charts and plots
Shared behavior of GoodData.UI visual components — responsive sizing, the style and data props model, and the visualization lifecycle callbacks.
InsightView
Render any saved GoodData visualization by reference with the InsightView component.
Chart configuration
Configure chart appearance, axes, legends, colors, and data labels.
Area chart
Display trends over time with filled areas using the AreaChart component.
Bar chart
Display horizontal bar comparisons with the BarChart component.
Bubble chart
Show three-dimensional data relationships using the BubbleChart component.
Bullet chart
Compare measures against targets using the BulletChart component.
Column chart
Display vertical bar comparisons with the ColumnChart component.
Combo chart
Combine bars and lines in a single visualization with the ComboChart component.
Dependency wheel chart
Visualize flows and relationships between categories with the DependencyWheel component.
Donut chart
Show proportions as a ring chart with the DonutChart component.
Funnel chart
Display sequential stages of a process with the FunnelChart component.
Geo area chart
Show geographic data as colored regions on a map with the GeoAreaChart component.
Geo chart
Display geographic data on an interactive map with the GeoChart component.
Geo pushpin chart
Plot data points on a map with pushpin markers using the GeoPushpinChart component.
Headline
Display a single KPI value or comparison with the Headline component.
Heatmap
Visualize data density across two dimensions with the Heatmap component.
Line chart
Display data trends as connected points with the LineChart component.
Mekko chart
Compare two measures across variable-width stacked columns with the Mekko component.
Pie chart
Show proportions of a whole with the PieChart component.
Pivot table
Display data in a flexible, multi-dimensional table with the PivotTableNext component.
Pyramid chart
Show hierarchical data as stacked layers with the PyramidChart component.
Radar chart
Compare measure values across categories on radial axes with the RadarChart component.
Repeater
Render repeated inline visualizations for each data row with the Repeater component.
Sankey chart
Visualize flow quantities between nodes with the SankeyChart component.
Scatter plot
Show correlation between two measures with the ScatterPlot component.
Treemap
Display hierarchical data as nested rectangles with the Treemap component.
Waterfall chart
Show cumulative contributions to a total with the WaterfallChart component.