UI Elements
Vertical Chart A bar chart component for comparing numeric values vertically
Vertical Chart displays a list of labeled values using vertical bars. It supports custom styling through the Styler system.
At runtime or in the editor, the chart rebuilds itself whenever data changes or when the RectTransform size updates. All visible elements are generated dynamically.
Name Type Description dataPointsList<DataPoint>List containing label and value
DataPoint
Field Type Description labelstringCategory label valuefloatBar value tableKey (optional)stringLocalization key for label
Name Type Description paddingRectOffsetPadding inside the chart area gridToBarsOffsetfloatGap between bars and grid barSpacingfloatSpacing between bars barCornerRadiusfloatCorner radius for rounded bars barSpriteSpriteCustom bar sprite (optional)
Name Type Description showGridboolShows horizontal grid lines horizontalGridLinesintNumber of grid lines gridLineThicknessfloatGrid line thickness
Name Type Description showAxisboolShows X and Y axis lines axisThicknessfloatAxis line thickness
Name Type Description showValuesboolPlaces numeric labels above bars valueHeightfloatHeight for numeric label area valueFontSizefloatFont size for value labels
Name Type Description labelHeightfloatHeight for label area below bars labelFontSizefloatFont size for category labels
Name Type Description stylingSourceStylingSourceCustom or Styler preset stylerPresetStylerPresetStyle preset gridColorColorMappingColor mapping for grid lines axisColorColorMappingColor mapping for axes barColorColorMappingColor mapping for bars labelColorColorMappingColor mapping for labels valueFontFontMappingFont used for value labels labelFontFontMappingFont used for category labels
Name Parameters Description UpdateData(newData)List<DataPoint>Replaces all data points DrawChart()None Forces a full redraw AddDataPoint(label, value)string, floatAdds a new bar RemoveDataPoint(index)intRemoves bar at index ClearData()None Clears all points SetDataPoint(index, label, value)int, string, floatUpdates a point SetDataPoint(item, label, value)DataPoint, string, floatUpdates specific item ShowValuesboolEnables or disables bar value labels
using UnityEngine ; using Evo . UI ; public class VerticalChartExample : MonoBehaviour { public VerticalChart chart ; void Start () { // Add or update data chart. AddDataPoint ( "Jan" , 60f ); chart. AddDataPoint ( "Feb" , 90f ); chart. SetDataPoint ( 0 , "January" , 75f ); // Toggle labels chart.ShowValues = true ; // Redraw chart. DrawChart (); } } 