> For the complete documentation index, see [llms.txt](https://developer.supervisely.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developer.supervisely.com/app-development/widgets/charts-and-plots.md).

# Charts and Plots

Widgets for graphically representing data, such as bar charts, line graphs, or scatter plots

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>LineChart</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-a7f814bb54cb9b21e9a26f4610e801c37fa7eb65%2Fwidget-lineChart.png?alt=media" alt=""></td><td><mark style="color:purple;">A widget that shows data as line graphs, ideal for tracking trends or comparing different data sets.</mark></td><td><a href="/app-development/widgets/charts-and-plots/linechart.md">LineChart</a></td></tr><tr><td><strong>GridChart</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-1624a48659514c1f4a9e7743d84c9f550cad20ca%2Fwidget-gridChart.png?alt=media" alt=""></td><td><mark style="color:purple;">The widget lets you easily view and access multiple LineChart plots arranged in a grid.</mark></td><td><a href="/app-development/widgets/charts-and-plots/gridchart.md">GridChart</a></td></tr><tr><td><strong>HeatmapChart</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-cdf59f7a0a805d3225ce8904f98fa87e4b25eab6%2Fwidget-HeatmapChart.png?alt=media" alt=""></td><td><mark style="color:purple;">Shows data in a color-coded matrix, typically used to represent the intensity or frequency of occurrences, with colors representing the value ranges</mark></td><td><a href="/app-development/widgets/charts-and-plots/heatmapchart.md">HeatmapChart</a></td></tr><tr><td><strong>ApexChart</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-ba2ff25f2fd62c1e576ebd622b70bb9d31cc7f5c%2Fwidget-apexChart.png?alt=media" alt=""></td><td><mark style="color:purple;">Versatile charting widget capable of displaying data in a variety of visual formats such as line, area, or bar charts</mark></td><td><a href="/app-development/widgets/charts-and-plots/apexchart.md">ApexChart</a></td></tr><tr><td><strong>ConfusionMatrix</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-37c7c08f660b58821769b124b8fa6d90c7ccbdd1%2Fwidget-confusionMatrix.png?alt=media" alt=""></td><td><mark style="color:purple;">Specialized chart for displaying the performance of a machine learning model, showing the actual versus predicted classifications and commonly used in classification problems to identify model performance</mark></td><td><a href="/app-development/widgets/charts-and-plots/confusionmatrix.md">ConfusionMatrix</a></td></tr><tr><td><strong>LinePlot</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-b485dd5d760e493707c5005ddf8005cf7e3dfde5%2Fwidget-linePlot.png?alt=media" alt=""></td><td><mark style="color:purple;">Similar to the LineChart, it displays data as a series of points connected by lines, which is typically used to observe trends and patterns in data over a continuous interval</mark></td><td><a href="/app-development/widgets/charts-and-plots/lineplot.md">LinePlot</a></td></tr><tr><td><strong>GridPlot</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-76d2b9bafd2268ad50c11a486e2546fea0a47f23%2Fwidget-gridPlot.png?alt=media" alt=""></td><td><mark style="color:purple;">Widget allows displaying multiple plots in a grid layout, enabling the comparison of different datasets or different aspects of a single dataset side by side</mark></td><td><a href="/app-development/widgets/charts-and-plots/gridplot.md">GridPlot</a></td></tr><tr><td><strong>ScatterChart</strong></td><td><img src="https://user-images.githubusercontent.com/79905215/223392072-fc3db4c2-27b9-42e8-b6eb-ecc8140fc138.png" alt="" data-size="original"></td><td><mark style="color:purple;">Widget is used to display a scatter plot of numerical data, which is beneficial for identifying the relationship or correlation between two variables</mark></td><td><a href="/app-development/widgets/charts-and-plots/scatterchart.md">ScatterChart</a></td></tr><tr><td><strong>TreemapChart</strong></td><td><img src="https://github-production-user-asset-6210df.s3.amazonaws.com/118521851/242254345-8fc4eccd-b04b-489a-89ee-4569de6a2624.png" alt="" data-size="original"></td><td><mark style="color:purple;">Displays a treemap chart of numerical data, where each category is represented by a rectangle, and sub-categories are nested as rectangles within these</mark></td><td><a href="/app-development/widgets/charts-and-plots/treemapchart.md">TreemapChart</a></td></tr><tr><td><strong>PieChart</strong></td><td><img src="https://1972929262-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2ZRtnNbqSpWk5uCfyE1A%2Fuploads%2Fgit-blob-4be0da539d2960f74ec2915b0c4171929c0f0da3%2Fpie-signature.png?alt=media" alt=""></td><td><mark style="color:purple;">Widget for visualizing data in a pie chart format. It is commonly used to represent proportions or percentages, showing how individual parts make up a whole</mark></td><td><a href="/app-development/widgets/charts-and-plots/piechart.md">PieChart</a></td></tr></tbody></table>