Generated by ScottPlot 4.1.67 on 8/13/2023
Customization
- Quickstart - Simple examples designed to help new users get familiar with ScottPlot.
- Axis and Ticks - Examples of common customizations for axis labels and ticks.
- Advanced Axis Features - Examples demonstrating advanced configuration of axis labels, lines, and ticks.
- Multi-Axis - Plot data using non-standard or additional axes.
- Style - Plots can be styled to customize their colors and fonts.
- Palette - The Palette defines default colors for new objects added to the plot.
- Layout - How to customize plot layout, padding, margins, axis spacing, etc.
- Legend - A legend is a key used to label lines and markers.
Plot Types
- Annotation - An Annotation is a text label that is placed on the plot in pixel space (not in coordinate space like a Text object).
- Arrow - Arrows point to a location in coordinate space.
- Axis Line and Span - Axis lines and axis spans extend infinitely in one direction.
- Bar Graph - How to create bar charts using ScottPlot.
- Bar Series - BarSeries plots allow customization of each bar individually.
- Bracket - Brackets highlight a range in coordinate space.
- Bubble Plot - Bubble plots display circles at specific X/Y locations.
- Colorbar - A colorbar displays a colormap beside the data area. Colorbars are typically added to plots containing heatmaps.
- Coxcomb Chart - A Coxcomb chart is a pie graph where the angle of slices is constant but the radii are not.
- Crosshair - The Crosshair plot type draws vertical and horizontal lines that intersect at a point on the plot and the coordinates of those lines are displayed on top of the axis ticks. This plot type is typically updated after MouseMove events to track the mouse.
- Data Logger - The DataLogger plot type facilitates displaying live data by giving the developer a simple way to Add() new data points by either shifting them in or appending them to a growing list. This plot type also has special options to manage axis limits as new data arrives. See code in the WinForms Demo app for advanced usage information.
- Ellipse - Ellipses are cuves with a defined center and distinct X and Y radii. A circle is an ellipse with an X radius equal to its Y radius.
- Error Bar - Error bars represent a range of uncertainty using a line and a perpendicular cap.
- Fill - Helper methods are available to help fill the region under a curve.
- Finance - Finance charts represent price over a binned time range using OHLC (open, high, low, close) data format.
- Function - Function plots accept a Func (not distinct X/Y data points) to create line plots which can be zoomed infinitely.
- Heatmap - Heatmaps display a 2D array using a colormap.
- Image - An image bitmap can be placed on the plot.
- Marker - A marker is a symbol placed at an X/Y point in coordinate space.
- Pie Chart - A pie chart illustrates numerical proportions as slices of a circle.
- Polygon - Polygons are 2D shapes made from pairs of X/Y points.
- Population - The population plot makes it easy to display populations as bar graphs, box-and-whisker plots, scattered values, or box plots and data points side-by-side. The population plot is different than using a box plot with an error bar in that you pass your original data into the population plot and it determines the standard deviation, standard error, quartiles, mean, median, outliers, etc., and you get to determine how to display these values.
- Radar Chart - Radar charts (also called a spider charts or star charts) represent multi-axis data as a 2D shape on axes arranged circularly around a center point.
- Radial Gauge - A radial gauge chart displays scalar data as circular gauges.
- Scale Bar - An L-shaped scalebar can be added in the corner of any plot.
- Scatter Plot - Scatter plots display small numbers of paired X/Y data points. Signal plots are much faster than scatter plots and should be used when X data is evenly spaced.
- Signal Plot - Signal plots are optimized to display data with evenly-spaced X values.
- SignalConst - SignalConst plots pre-processes data to render much faster than Signal plots. Pre-processing takes time up-front and requires 4x the memory of Signal.
- SignalXY - SignalXY is a speed-optimized plot for displaying Y vaues with unevenly-spaced (but always increasing) X positions.
- Text - A text label that is placed at an X/Y coordinate on the plot (not in pixel space like an Annotation).
- Tooltip - Tooltips are annotations that point to an X/Y coordinate on the plot.
- Vector Field - Vector fields use arrows to show direction and magnitude of data points in a 2D array and are ideal for visualizing data explained by differential equations.
Additional Examples
- Statistics - How to use statistics tools bundled with ScottPlot.
- Miscellaneous - A collection of examples demonstrating obscure configuration options.
Colors
- Color - Lists of colors in each color palette for representing categorical data
- Colormaps - Color gradients available to represent continuous data
Simple examples designed to help new users get familiar with ScottPlot.
Scatter plots have paired X/Y points.
Signal plots have evenly spaced Y points. Signal plots are very fast and can interactively display millions of data points. There are many different types of plottable objects, each serving a different purpose.
Axis labels and limits can be customized
You can create a plot manually, then add it to the plot with Add(). This allows you to create custom plot types and add them to the plot.
Call Remove() to remove a specific plottable.
Call Clear() to remove all plottables from the plot. Overloads of Clear() allow you to remote one type of plottable, or a specific plottable.
Most plottable objects have a Label which defines how they appear in the legend
Examples of common customizations for axis labels and ticks.
Axes can be customized different ways. Axis labels and colors are the most common types of customizations.
Visibility of primary X and Y grids can be set using a single method.
Grid line visibility can be controlled for each axis individually. Use this to selectively enable grid lines only for the axes of interest. Keep in mind that vertical grid lines are controlled by horizontal axes.
Sometimes it's useful to draw the grid lines above the plottables rather than below.
Common grid line configurations are available.
Frameless plots can display data that appraoches the edge of the figure.
Axis ticks and lines can be disabled. Note that hiding them in this way preserves their whitespace. Setting XAxis.IsVisible to false would collapse the axis entirely.
Horizontal tick labels can be rotated as desired.
Vertical tick labels can be rotated as desired.
This example show how to change the width of the X axe ticks
This example shows how to display DateTime data on the horizontal axis. Use DateTime.ToOADate() to convert DateTime[] to double[], plot the data, then tell the axis to format tick labels as dates.
DateTime can be displayed on the horizontal axis of a signal plot by using the sample rate to set the time interval per data point, and then setting the OffsetX to the desired start date.
Axes can be given boundaries which prevent the user from panning outside a given range.
Axes can be given a zoom limit which allows the user to pan everywhere but never zoom in beyond a given span
Examples demonstrating advanced configuration of axis labels, lines, and ticks.
Grid lines can be extensively customized using various configuration methods.
Tick labels can be converted to text using a custom format string.
Tick positions and labels can be defined manually.
Tick positions and labels can be defined manually, but also added alongside automatic tick labels.
Plot data on regular cartesian space then manually control axis labels to give the appearance of non-linear spacing between points.
ScottPlot will always display data where X values ascend from left to right. To simulate an inverted axis (where numbers decrease from left to right) plot data in the negative space, then invert the sign of tick labels.
The space between tick marks can be manually defined by setting the grid spacing.
Large numbers and dates are formatted differently for different cultures. Hungarian uses spaces to separate large numbers and periods to separate fields in dates.
SetCulture() as arguments to let the user manually define formatting strings which will be used globally to change how numbers and dates are formatted.
Multiplier notation keeps tick labels small when plotting large data values. This style is also called engineering notation or scientific notation.
Offset notation keeps tick labels small when plotting large data values that are close together.
This example shows how to use a fixed inter-tick distance for a DateTime axis
ScottPlot is designed to display 2D data on linear X and Y axes, but you can log-transform data before plotting it and customize the ticks and grid to give the appearance of logarithmic scales.
Numer of minor ticks between major ticks can be customized.
Ruler mode is an alternative way to display axis ticks. It draws long ticks and offsets the tick labels to give the appearance of a ruler.
A helper function converts radius and theta arrays into Cartesian coordinates suitable for plotting with traditioanl plot types.
Images can be used as axis labels to allow for things like LaTeX axis labels.
Transparency in PNGs is respected, but JPEG files do not support transparency.
Axis tick density can be adjusted by the user. The largest the density is, the more ticks are displayed. Setting this value too high will result in overlapping tick labels.
Minimum tick spacing can be defined such that zooming in does not produce more grid lines, ticks, and tick labels beyond the defined limit.
For ultimate control over tick label format you can create a custom formatter function and use that to convert positions to labels. This allows logic to be used to format tick labels.
Tick marks can be outward (default) or inverted to appear as inward lines relative to the edge of the plot area.
Axis labels, tick marks, and axis lines can all be extensively customized by interacting directly with axis configuration objects.
Plot data using non-standard or additional axes.
Plots always have 4 fundamental axes available to work with. By default primary axes are totally visible, and secondary axes have ticks hidden and no label. Sometimes the top axis is given a label to simulate a plot title.
Additional axes can be added on any edge. Additional axes stack away from the plot area.
This example demonstrates how to display a Y axis on the right side of the figure. The vertical axis to the right of the figure is index 1, so plots must be updated to indicate they are to use a nonstandard axis index.
This example demonstrates how to display an X axis above the figure. The horizontal axis above the figure is index 1, so plots must be updated to indicate they are to use a nonstandard axis index.
Visibility of axes can be toggled. In this example an additional Y axis is added but the primary Y axis is hidden. The result is a plot that appears to only have one Y axis.
Axis limits can be set for each axis by indicating which axis index you are wish to modify when setting axis limits.
Plots can be styled to customize their colors and fonts.
This example demonstrates the default plot style.
Plots have two background colors that can be individually customized. The figure background is the background of the whole image. The data background is the background of the rectangle that contains the data. Both background types support transparency, although PNG file export is required.
Customize many plot features using style presets
Customize many plot features using style presets
Customize many plot features using style presets
Customize many plot features using style presets
Customize many plot features using style presets
Customize many plot features using style presets
Customize many plot features using style presets
A backgorund image can be drawn behind the data area. Users to do this may want to make grid lines semitransparent.
A backgorund image can be drawn behind the entire figure. If you do this you likely want to make your data background transparent.
A customizable line style exists which allows users to define any pattern.
The Palette defines default colors for new objects added to the plot.
This 10-color palette is the default colorset used by ScottPlot. It is the same default colorset used by modern versions of Matplotlib (https://matplotlib.org/2.0.2/users/dflt_style_changes.html)
This 20-color palette is similar to the default, but optimized for situations where more than 10 plottables are required. Every second color is a lighter version of the color before it. This palette was sourced from Matplotlib.
Aurora is a 5-color palette sourced from Nord.
Frost is a 4-color palette sourced from Nord.
Nord is a 7-color palette derived from Aurora source from NordConEmu.
PolarNight is a 4-color palette sourced from Nord. This palette is optimized for a dark background.
SnowStorm is a 3-color palette sourced from Nord.
OneHalf is a 7-color palette sourced from Sublime
OneHalfDark is a 7-color palette of colors complimentary to the OneHalf palette desaturated and optimized for a dark background. #2e3440 is a recommended background color with this palette.
A custom palette can be created from an array of HTML color values. These colors will be used as the default colors for new plottables added to the plot.
This is the default 12-color palette used by Microcharts.
8-color palette that has good overall variability and can be differentiated by individuals with red-green color blindness. Colors originated from Wong 2011, https://www.nature.com/articles/nmeth.1618.pdf
An Annotation is a text label that is placed on the plot in pixel space (not in coordinate space like a Text object).
Annotations are labels placed at a X/Y location on the figure (not coordinates of the data area). Unlike the Text plottable, annotations do not move as the axes are adjusted.
Arrows point to a location in coordinate space.
Arrows point to specific locations on the plot.
Axis lines and axis spans extend infinitely in one direction.
An axis line marks a position on an axis. Axis lines extend to positive and negative infinity on the other axis.
Axis lines can have lower and/or upper bounds. This can be useful for labeling points of interest.
In GUI environments, axis lines can be draggable and moved with the mouse. Drag limits define the boundaries the lines can be dragged.
Draggables can be configured to snap to the nearest integer or to a user-defined list of Positions out of the box.
Custom logic can be added to draggables to customize how they snap.
Axis line positions can be labeled on the axis on top of axis ticks and tick labels. Custom position formatters allow for full customization of the text displayed in these labels. If using a DateTime axis, implement a custom formatter that uses DateTime.FromOADate().
Position labels can be added to multi-axis plots. The axis line must be told which axis to render the label on.
Axis spans shade a portion of one axis. Axis spans extend to negative and positive infinity on the other axis.
Axis spans can be dragged using the mouse. Drag limits are boundaries over which the edges of spans cannot cross.
Axis spans can be dragged using the mouse. Span events can be useful for binding span edge values to UI elements.
Calling Plot.AxisAuto (or middle-clicking the plot) will set the axis limits automatically to fit the data on the plot. By default the position of axis lines and spans are included in automatic axis limit calculations, but setting the '' flag can disable this behavior.
Repeating axis lines allows to plot several axis lines, either horizontal or vertical, draggable or not, whose positions are linked
An AxisLineVector allows to setup a series of VLines or HLines, without hassle.These lines can optionally be dragged as their counterparts
How to create bar charts using ScottPlot.
A simple bar graph can be created from a series of values. By default values are palced at X positions 0, 1, 2, etc.
Horizontal positions for each bar can be defined manually. If you define bar positions, you will probably want to define the bar width as well.
Bars placed at specific positions can be labeled by setting tick labels for those positions.
Errorbars can be added to any bar graph.
Bars can be overlapped to give the appearance of stacking.
The value of each bar can be displayed above it.
Font styling for bar value labels can be customized.
A custom formatter can be used to generate labels above each bar using the numeric value of the bar itself.
Bar graph fill pattern can be customized.
Bar graphs are typically displayed as columns, but it's possible to show bars as rows.
By customizing positions of multiple bar plots you can achieve the appearance of grouped bar graphs. The AddBarGroups() method is designed to simplify this process. More advanced grouping and bar plot styling is possible using the Population plot type.
By default bar graphs start at 0, but this does not have to be the case. Y offsets can be defined for each bar. When Y offsets are used, values represent the height of the bars (relative to their offsets).
Bars with negative values can be colored differently than positive ones.
Waterfall bar graphs use bars to represent changes in value from the previous level. This style graph can be created by offseting each bar by the sum of all bars preceeding it. This effect is similar to financial plots (OHLC and Candlestick) which are described in another section.
Lollipop plots convey the same information as Bar plots but have a different appearance.
Lollipop plots can be extensively customized.
Cleveland Dot Plots allow comparing two categories in situations where a Bar Plot may be crowded.
Bars have a default width of 1.0, but when using DateTime axis this means bars are one day wide. To plot DateTime data you may need to manually set the width of a bar to a desired size (in fractions of a day).
BarSeries plots allow customization of each bar individually.
A BarSeries plot allows each Bar to be created and customized individually.
Horizontal orientation can be achieved by customizing the IsVertical property of each Bar.
Combine a BarSeries plot with an ErrorBar plot to achieve this effect.
By customizing each Bar of a BarSeries we can achieve a stacked bar plot. Text objects can be added to the plot to serve as labels.
Value labels above bars can be customized.
Brackets highlight a range in coordinate space.
Brackets are useful for annotating a range of data.
By default bracket labels appear clockwise relative to the line formed by their two points. Users can invert the direction of brackets as needed.
Brackets have additional options for customizations.
Bubble plots display circles at specific X/Y locations.
Bubble plots display circles at specific X/Y locations. Each circle can be individually customized. Save the object that is returned when the bubble plot is created and call its Add() method to add bubbles.
The size of bubbles are defined in pixel units by default. However, it is possible to define the size of bubbles using the same units the coordinate system and axes use. If using axis units, users may want to enable the axis scale lock feature to enforce bubble circularity.
Bubble plots can be combined with other plot types to create more advanced charts. In this example each bubble is accompanied by a text object. Bubbles are also colored according to their size such that smaller bubbles are bluer.
A colorbar displays a colormap beside the data area. Colorbars are typically added to plots containing heatmaps.
A colorbar displays a colormap beside the data area. Colorbars are typically added to plots containing heatmaps.
By default colorbars use the Viridis colormap, but this behavior can be customized and many colormaps are available.
Tick marks can be added to colorbars. Each tick is described by a position (a fraction of the distance from the bottom to the top) and a string (the tick label).
You can restrict a colorbar to only show a small range of a colormap. In this example we only use the middle of a rainbow colormap.
If data values extend beyond the min/max range displayed by a colorbar you can indicate the colormap is clipping the data values and inequality symbols will be displayed in the tick labeles at the edge of the colorbar.
This example shows how to add differently colored markers to the plot to simulate a scatter plot with points colored according to a colorbar. Note that the colormap generates the colors, and that a colorbar just displays a colormap
A colorbar may be added to the left side of the chart
Colorbars have a Label property similar to X and Y axes.
A Coxcomb chart is a pie graph where the angle of slices is constant but the radii are not.
A Pie chart where the angle of slices is constant but the radii are not.
Coxcomb charts allow custom hatching of their slices.
A Pie chart where the angle of slices is constant but the radii are not, icons are used for quick reference.
The Crosshair plot type draws vertical and horizontal lines that intersect at a point on the plot and the coordinates of those lines are displayed on top of the axis ticks. This plot type is typically updated after MouseMove events to track the mouse.
The Crosshair plot type draws vertical and horizontal lines that intersect at a point on the plot and the coordinates of those lines are displayed on top of the axis ticks. This plot type is typically updated after MouseMove events to track the mouse
Crosshair styling and label formatting can be customized by accessing public fields.
Crosshair labels display numeric labels by default, but a public field makes it possible to convert positions to DateTime (FromOATime) when generating their axis labels.
For ultimate control over crosshair label format you can create a custom formatter function and use that to convert positions to labels. This allows logic to be used to format crosshair labels.
Crosshairs label coordinates on the primary axes by default, but the axis index can be changed allowing multiple crosshairs to label multiple axes.
The DataLogger plot type facilitates displaying live data by giving the developer a simple way to Add() new data points by either shifting them in or appending them to a growing list. This plot type also has special options to manage axis limits as new data arrives. See code in the WinForms Demo app for advanced usage information.
A DataLogger is a plot type designed for growing datasets. Unlike most other plot types, the DataLogger can automatically expand the axis limits to accommodate new data as it is added.
A DataStreamer is a plot type designed for streaming datasets with a fixed length display and even X spacing between Y data points. As new data is shifted in, old data is shifted out, and the displayed trace is always the same size.
Ellipses are cuves with a defined center and distinct X and Y radii. A circle is an ellipse with an X radius equal to its Y radius.
Ellipses can be added to plots
Circles can be added to plots. Circles are really Ellipses with the same X and Y radius. Note that circles appear as ellipses unless the plot has a square coordinate system.
For circles to always appear circular, the coordinate system must be forced to always display square-shaped pixels. This can be achieved by enabling the axis scale lock.
Ellipses styles can be extensively customized
Ellipses can also be rotated
Error bars represent a range of uncertainty using a line and a perpendicular cap.
Error Bars allow more fine-grained control over how your error bars are shown.
There's a shorthand method for error bars where the positive and negative error is the same.
If you only have error data for one dimension you can simply pass in null for the other dimension.
You can customize the colour, cap size, and line width of the error bars.
An optional marker can be drawn at the center X/Y position for each error bar.
Helper methods are available to help fill the region under a curve.
Fill methods help to create semitransparent polygons to fill the area under a curve. This can be used to give the appearance of shading under a scatter plot, even though the plottable created here is a polygon with optional edge color and fill color.
Sometimes you want to share the area under a curve, but change its color depending on which side of the baseline value it is. There's a helper method to make this easier.
Given two curves, a polygon can be created to give the appearance of shading between them. Here we will display two scatter plots, then create a polygon to fill the region between them.
Hatched Fills are useful for when there are overlapping fills, such as this diagram depicting the ranges of possible producer surpluses under a price floor.
Finance charts represent price over a binned time range using OHLC (open, high, low, close) data format.
Price movement over time periods are represented using OHLC objects. A single OHLC holds open, high, low, and close pricing. Users can create their own OHLC arrays, or use the sample data generator to practice working with financial data.
OHLC charts are an alternative to candlestick charts. They show high and low prices as a vertical line, and indicate open and close prices with little ticks to the left and to the right.
You probably never want to do this... but OHLCs have an X value you can customize to be a DateTime (converted to a double using DateTime.ToOATime()). The advantage is that you can use the native DateTime axis support on the horizontal axis. The disadvantage is that gaps in time appear as gaps in the candlesticks. Weekends without trading will appear as gaps. The alternative to this method is to plot a series of OHLCs using sequential numbers, then manually define the axis tick labels.
A better way to represent time on the horizontal axis is to use traditional Cartesian coordinates so each candlestick is placed at X positions (0, 1, 2, etc.), then manually define the locations and label text of important positions on the plot. This is clunky, but possible. This inelegance is why financial charting is probably best done with real financial charting libraries, not a scientific charting library like ScottPlot...
A simple moving average (SMA) technical indicator can be calculated and drawn as a scatter plot.
Bollinger bands are a common technical indicator that show the average +/- two times the standard deviation of a given time range preceeding it.
Newer data appears on the ride side of the chart so financial charts are often displayed with the vertical axis label on the right side as well. This is possible by disabling the left vertical axis (YAxis) and enabling the right one (YAxis2). The left and right Y axes are index 0 and 1 (respectively), and the plottable has to be update to indicate which axis index it should render on.
By default candle wicks are the same color as their bodies, but this can be customized.
Candles that close below their open price are colored differently from candles which close at or above it. These colors can be customized. Combine this styling with a custom wick color (which also controls the candle border) to create a different visual style.
A dark mode finance plot can be realized by customizing color options of the candles and figure. Colors in this example were chosen to mimic TC2000.
Function plots accept a Func (not distinct X/Y data points) to create line plots which can be zoomed infinitely.
Function plots are defined by a function (not X/Y data points) so the curve is continuous and can be zoomed in and out infinitely
Heatmaps display a 2D array using a colormap.
Heatmaps display a 2D array using a colormap.
Heatmaps can be flipped vertically and/or horizontally.
The heatmap can fit the plot area exactly if margins are set to zero and the square axis lock is disabled.
Colorbars are often added when heatmaps are used.
Heatmaps display values as rectangles with sharp borders by default. Enabling the Smooth feature uses bicubic interpolation to display the heatmap as a smooth gradient between values.
Image data can be plotted using the heatmap plot type.
Heatmaps have an Opacity property that can be set anywhere from 0 (transparent) to 1 (opaque).
A single-color heatmap can be created where cell transparency is defined by a 2D array containing values 0 to 1.
This example demonstrates a heatmap with 1000 tiles
Viridis is the default colormap, but several alternatives are available.
Viridis is the default colormap, but several alternatives are available.
Heatmap data can be presented using a colormap defined by a fixed set of colors.
Heatmap colormap scale can use a defined min/max value.
The value range displayed by the colormap can restricted to a narrow subset of the full data range. Tick labels at the edges of the colorbar can be made to show inequality symbols to indicate the range of data is being clipped when translating values to colors.
Heatmaps can be created from random 2D data points using the count within a square of fixed size.
Heatmaps can be created from 2D data points using bilinear interpolation with Gaussian weighting. This option results in a heatmap with a standard deviation of 4.
By default heatmaps start at the origin and each rectangle (cell) is 1 unit in size, but heatmap offset and cell size can be customized.
You can use a 2D array of nullable doubles to indicate some squares do not contain data. This allows the user to display heatmaps with transparency and implement non-rectangular heatmaps.
The intensities of heatmaps are mapped to color, but an optional 2D array of alpha values may be provided to separately control transparency of squares.
Edges of the heatmap can be defined as an alternative to defining offset and cell size,
A Heatmap can be rotated clockwise around around a user-specified center of rotation. Locking axis scales to enforce square pixels is recommended. Rotation occurs after any flipping operations.
Heatmaps can be clipped to an arbitrary polygon
Binned histograms are 2D heatmaps that use a colormap to display cell counts. Charts like this are commonly used in scientific and medical applications.
An image bitmap can be placed on the plot.
The Image plottable places a Bitmap at coordinte in axis space.
By default the X/Y coordinates define the upper left position of the image, but alignment can be customized by defining the anchor.
Images can be rotated around the position defined by their anchor.
The borders of images can be customized.
Size of the image (in relative pixel units) can be adjusted.
By default image dimensions are in pixel units so they are not stretched as axes are manipulated. However, users have the option to define image dimensions in axis units. In this case, corners of images will remain fixed on the coordinate system and will get stretched as axes are stretched.
Images can be clipped to an arbitrary polygon
Images have an option to enable or disable anti-aliasing
How to customize plot layout, padding, margins, axis spacing, etc.
ScottPlot has many ways to customize the layout. This example demonstrates the default layout, where padding around the data area is automatically determined by measuring the text in the axis labels and tick labels to ensure there is appropriate padding on all sides.
Call Layout() to manually define padding on all edges of the data area. This is the easiest way to make room for large custom tick labels. Under the hood, this method sets the minimum size of all 4 primary axes.
The size of each axis can be individually customized. Note that axes automatically resize themselves to accomodate tick labels, but this method lets users customize the min/max boundaries of axis size. Set both numbers to the same value to force an axis to always be a specific size.
Axis label and ticks are enclosed in a rectangle that is automatically sized to accomodate them (optionally limited to a min/max size as seen earlier). This rectangle has a small amount of padding on all sides so axis labels do not touch the final pixel on the edge of the figure. The amount of extra padding around each axis can be customized.
The Frameless() method disables and collapses all axes so the data area is all that appears. Although the figure background is blue in this example, none of it will show, because the data area occupies all of the available space.
Users who want to define the amount of space around their data can use Margins() to automatically pad data boundaries with a certain percentage of extra space when axis limits are calculated automatically. Note that this operation acts on the axis limits, and does not technically adjust the layout of the plot itself.
The layout system automatically measures axis labels and ticks to provide a plot with the largest data area possible. However, this can be problematic for animated plots (with changing tick label sizes) or when users wish to achieve pixel-perfect similarity between two different plots. In these cases the user can manually override the layout system and define exactly how large the data area is.
A legend is a key used to label lines and markers.
Add labels to plot items, then enable the legend to display a key in the corner of the data area.
Legends can be placed at various locations within the plot area
Legends can be customized to support horizontal orientation
A marker is a symbol placed at an X/Y point in coordinate space.
You can place individual markers anywhere on the plot.
A special type of marker exists which allows dragging with the mouse.
This example shows how to add a draggable marker which is constrained to positions defined by an array of X/Y pairs.
Markers have an optional text label.
Markers have options that can be customized, such as line width.
Circles can be added anywhere on the plot. If a line style is used, a custom pattern should be created.
A pie chart illustrates numerical proportions as slices of a circle.
A pie chart illustrates numerical proportions as slices of a circle.
Exploded pie charts have a bit of space between their slices.
Donut plots are pie charts with a hollow center.
Custom text can be displayed in the center of a donut chart. Notice too how the colors of each slice are customized in this example.
The value of each slice can be displayed at its center.
The percentage of each slice can be displayed at its center.
Slice label position can be customized to place labels outside the pie. If labels are placed outside the pie, the pie size should be reduced to make room for them.
Colors for pie slices and labels can be customized.
Hatching (patterns) for pie slices and labels can be customized.
Slices can be labeled in the legend.
Slices can labeled with values, percentages, and lables, with a legend.
Custom slice labels can be used to display values using custom formats
You can define the size of the pie to make room for large labels.
Labels for slices and legend items can be independently configured.
Polygons are 2D shapes made from pairs of X/Y points.
Polygons are 2D shapes made from pairs of X/Y points. The last point connects back to the first point, forming a closed shape. Polygons can be optionally outlined and optionally filled. Colors with semitransparency are especially useful for polygons.
Polygons can be used to create 2D shapes resembling filled line plots. When mixed with semitransprent fills, these can be useful for displaying data.
A shaded area between two curves can be created by enclosing the area as a polygon. For this to work the two curves must share the same X points.
A stacked filled line plot effect can be achieved by overlapping polygons.
Special rendering optimizations are available to display a large number of polygons.
The population plot makes it easy to display populations as bar graphs, box-and-whisker plots, scattered values, or box plots and data points side-by-side. The population plot is different than using a box plot with an error bar in that you pass your original data into the population plot and it determines the standard deviation, standard error, quartiles, mean, median, outliers, etc., and you get to determine how to display these values.
The population plot makes it easy to display populations as bar graphs, box-and-whisker plots, scattered values, or box plots and data points side-by-side. The population plot is different than using a box plot with an error bar in that you pass your original data into the population plot and it determines the standard deviation, standard error, quartiles, mean, median, outliers, etc., and you get to determine how to display these values.
Multiple populations can be assembled into an array and plotted as a single group.
Alternate styling options allow data points to be displayed over the box and whisker plots.
Multiple series of population groups can be plotted Here each group is clustered on the horizontal axis, and each series is given a different color and appears in the legend.
Populations can be displayed many different ways. Scatter values can be displayed on either side of the bar or bar. Populations can be shown as bar graphs instead of box plots. Public fields allow many additional customizations.
Radar charts (also called a spider charts or star charts) represent multi-axis data as a 2D shape on axes arranged circularly around a center point.
A radar chart concisely displays multiple values. Radar plots are also called a spider charts or star charts.
Change the axis type to polygon to display radar charts with straight lines.
A radar chart can have no drawn axis as well.
The Smooth field controls whether radar areas are drawn with smooth or straight lines.
Category labels can be displayed on the radar chart.
Labels can be displayed on the arms of the radar chart.
The thickness of each radar plot's outline can be customized.
The hatch of each radar plot can be customized
Images can be displayed on the arms of the radar chart. When using images, labels will be ignored so setting them will have no effect.
Axis scaling can be independent, allowing values for each category to be displayed using a different scale. When independent axis mode is enabled, axis limits are automatically adjusted to fit the range of the data.
Radar charts with independent axis limits use scales fitted to the data by default, but scaling can be controlled by defining the maximum value for each axis.
Radar charts support customization of the line color and width.
A radial gauge chart displays scalar data as circular gauges.
A radial gauge chart displays scalar data as circular gauges.
Gauge colors can be customized by changing the default palette.
Radial gauge plots support positive and negative values.
Sequential gauge mode indicates that the base of each gauge starts at the tip of the previous gauge.
Gauges are displayed from the center outward by default but the order can be customized.
The SingleGauge mode draws all gauges stacked together as a single gauge. This is useful for showing a progress gauges composed of many individual smaller gauges.
The direction of gauges can be customized. Clockwise is used by default.
The empty space between gauges can be adjusted as a fraction of their width.
Caps can be customized for the starting and end of the gauges.
The starting angle for gauges can be customized. 270 for North (default value), 0 for East, 90 for South, 180 for West, etc.
By default gauges are full circles (360 degrees) but smaller gauges can be created by customizing the gauge size.
The value of each gauge is displayed as text by default but this behavior can be overridden. Note that this is different than the labels fiels which is what appears in the legened.
Gauge level text is positioned at the tip of each gauge by default, but this position can be adjusted by the user.
Size of the gauge level text as a fraction of the gauge width.
Level text fonts may be customized.
Radial gauge labels will appear in the legend if they are assigned.
By default the full range of each gauge is drawn as a semitransparent ring. The amount of transparency can be adjusted as desired.
Gauge backgrounds are drawn as full circles by default. This behavior can be disabled to draw partial backgrounds for non-circular gauges.
An L-shaped scalebar can be added in the corner of any plot.
An L-shaped scalebar can be added in the corner of any plot. Set the vertical or horizontal sizer to zero and the scale bar will only span one dimension.
Set the vertical or horizontal sizer to zero and the scale bar will only span one dimension.
An L-shaped scalebar can be added in the corner of any plot. Set the vertical or horizontal sizer to zero and the scale bar will only span one dimension.
Scatter plots display small numbers of paired X/Y data points. Signal plots are much faster than scatter plots and should be used when X data is evenly spaced.
Scatter plots are best for small numbers of paired X/Y data points. For evenly-spaced data points Signal is much faster.
Markers can be customized using optional arguments and public fields.
Legend indicates names of all available marker shapes
Line color, size, and style can be customized. Setting markerSize to 0 prevents markers from being rendered.
X data for scatter plots does not have to be evenly spaced, making scatter plots are ideal for displaying random data like this.
An array of values can be supplied for error bars and redering options can be customized as desired
A semitransparent polygon can be created and placed behind the scatter plot to represent standard deviation or standard error.
A shortcut method makes it easy to create a scatter plot with just lines (no markers)
A shortcut method makes it easy to create a scatter plot where markers are displayed at every point (without any connecting lines)
A step plot is a special type of scatter plot where points are connected by right angles instead of straight lines.
Want to place a marker at a position in X/Y space? AddMarker() will create a scatter plot with a single point.
Want to modify the scatter points interactively? A ScatterPlotDraggable lets you move the points around with the mouse. As you move the points around, the values in the original arrays change to reflect their new positions.
You can restrict dragging to just X or Y directions.
Scatter plots can be used to create forest plots, which are useful for showing the agreement between multiple estimates.
Lines drawn between scatter plot points are typically connected with straight lines, but the Smooth property can be enabled to connect points with curves instead.
When the OnNaN field is set to Ignore, points containing NaN X or Y values are skipped, and the scatter plot is drawn as one continuous line.
When the OnNaN field is set to Gap, points containing NaN X or Y values break the line. This results in a scatter plot appearing as multiple lines, with gaps representing missing data.
Individual points can be labeled.
This plot type has add/remove/clear methods like typical lists.
This plot type supports generics.
There exists a Scatter Plot List with draggable points.
A custom function can be used to limit the range of draggable points.
Signal plots are optimized to display data with evenly-spaced X values.
Signal plots are ideal for evenly-spaced data with thousands or millions of points.
Signal plots accept double arrays by default, but a generic signal plot exists which can display most numeric data types.
Signal plots can have X and Y offsets that shift all data by a defined amount.
Signal plots can have a Y scale that multiply all data by a defined amount. ScaleY is applied before OffsetX and OffsetY.
Compare the speed to the same data plotted as a scatter plot.
Signal plots can be styled using public fields. Signal plots can also be offset by a defined X or Y amount.
Signal plots can be styled as step plots where points are connected by right angles instead of straight lines.
Signal plots with millions of points can be interacted with in real time.
When plotting extremely high density data, you can't always see the trends underneath all those overlapping data points. If you send an array of colors to PlotSignal(), it will use those colors to display density.
When plotting live data it is useful to allocate a large array in memory then fill it with values as they come in. By setting the maxRenderIndex property of a scatter plot to can prevent rendering the end of the array (which is probably filled with zeros).
It is sometimes useful to only display values within a range of the source data array.
Signal plots can be filled below with a solid color.
Signal plots can be filled below using a color gradient.
Signal plots can be filled above using a color gradient.
Signal plots can be filled above and below
Gradients can be used to fill above and below.
The Smooth field controls whether signal plot lines are drawn with smooth or straight line.
The markers that display when signal plots are zoomed in may have a different color than the lines connecting them
SignalConst plots pre-processes data to render much faster than Signal plots. Pre-processing takes time up-front and requires 4x the memory of Signal.
SignalConst plots pre-processes data to render much faster than Signal plots. Pre-processing takes a little time up-front and requires 4x the memory of Signal.
SignalConst supports other data types beyond just double arrays. You can use this plot type to display data in any numerical format that can be cast to a double.
SignalConst is fast because it pre-processes data, but changing data requires additional processing before it can be rendered properly. Use the SignalPlot's Update() function to update data values instead of modifying contents of the original array that was used to create the signal plot.
SignalXY is a speed-optimized plot for displaying Y vaues with unevenly-spaced (but always increasing) X positions.
SignalXY is a speed-optimized plot for displaying vaues (Ys) with unevenly-spaced positions (Xs) that are in ascending order. If your data is evenly-spaced, Signal and SignalConst is faster.
SignalXY plots can have X and Y offsets that shift all data by a defined amount.
SignalXY plots can have a Y scale that multiply all data by a defined amount. ScaleY is applied before OffsetX and OffsetY.
Signal with defined Xs that contain gaps
Signal with mised low and high density data
Data points can be connected with steps (instead of straight lines).
Various options allow shading above/below the signal data.
SignalXY plots have markers which only appear when they are zoomed in.
SignalXYConst is a speed-optimized plot for displaying vaues (Ys) with unevenly-spaced positions (Xs) that are in ascending order. If your data is evenly-spaced, Signal and SignalConst is faster.
SignalXYConst with (int)Xs and (float)Ys arrays
Data points can be connected with steps (instead of straight lines).
How to use statistics tools bundled with ScottPlot.
The Histogram class provides an easy way to count the number of data values in binned ranges.
A histogram can be created using fixed size bins.
Histograms can be displayed as binned probability instead of binned counts. The ideal probability curve can also be plotted.
This example demonstrates how to display a histogram counts on the primary Y axis and the probability curve on the secondary Y axis.
This example demonstrates how to display a histogram with labeled mean and standard deviations.
This example demonstrates two histograms on the same plot. Note the use of fractional units on the vertical axis, allowing easy comparison of datasets with different numbers of points. Unlike the previous example, this one does not use multiple axes.
This example demonstrates how to plot a cumulative probability histogram (CPH) to compare the distribution of two datasets.
A regression module is available to simplify the act of creating a linear regression line fitted to the data.
The Nth order statistic of a set is the Nth smallest value of the set (indexed from 1).
Percentiles are a good tool to analyze the distribution of your data and filter out extreme values.
A q-Quantile is a generalization of quartiles and percentiles to any number of buckets.
A text label that is placed at an X/Y coordinate on the plot (not in pixel space like an Annotation).
The Text plottable displays a string at an X/Y coordinate in unit space. Unlike the Annotation plottable, text moves when the axes are adjusted.
Alignment indicates which corner is placed at the X/Y coordinate.
You can pass in a Font to further customize font options
Tooltips are annotations that point to an X/Y coordinate on the plot.
Tooltips are annotations that point to an X/Y coordinate on the plot
Tooltips fonts can be customized
Tooltips border and fill styles can be customized
Vector fields use arrows to show direction and magnitude of data points in a 2D array and are ideal for visualizing data explained by differential equations.
A vector field can be useful to show data explained by differential equations
This example demonstrates how to define vectors according to a given angle and magnitude.
A colormap can be supplied to color arrows according to their magnitude
A custom scale factor can adjust the length of the arrows.
Use a slower drawing method that draws tips that are proportional to the length of the arrows.
Vectors can be placed arbitrarily in coordiante space (they are not required to be in a grid)
A collection of examples demonstrating obscure configuration options.
Interpolated splines create curves with many X/Y points to smoothly connect a limited number of input points.
Different methods are available for smoothing data using interpolation, curve fitting, or corner cutting. Notice that some methods produce curves which pass through the original data points and others do not.
The raw trace (voltage) and first derivative (voltage change / time) of a mammalian action potential.
When display scaling is enabled the dots per inch (DPI) is changed so images appear larger. When scaling is increased bitmap images are stretched to appear larger, but may appear blurry as a result. Alternatively images could be increased in size when DPI scaling is enabled, but fonts and lines may appear small. This example shows how to increase the size of common plot components so they look good on high resolution scaled displays (e.g., 4K monitors). DPI stretching can be set in the user control's Configuration module.
Rectangles can be added to plots.