Build Your First Chart

Inspector path: no code

Use the Inspector path when you want a fast dashboard, HUD, prototype, or designer-owned chart. ChartGraphic owns rendering and chart settings. A data source component feeds marks into it.

• Use MockChartDataSource for instant generated data.
• Use ManualChartDataSource when you want to type values directly into the Inspector.
• Use file or web data sources when a chart should follow CSV, JSON, Google Sheets, HTTP, Yahoo Finance, or high-throughput live samples.

Code path: full control

Use the code path when chart data is produced by gameplay, simulation, analytics, editor tooling, or custom runtime systems.

using ChartGuru;
using UnityEngine;

public sealed class MonthlySalesChart : MonoBehaviour
{
    private ChartGraphic _graphic;

    private void Start()
    {
        float[] values = { 65f, 89f, 45f, 78f, 92f, 55f };
        string[] labels = { "Jan", "Feb", "Mar", "Apr", "May", "Jun" };

        ChartBuilder builder = Chart.Create();
        for (int i = 0; i < values.Length; i++)
        {
            BarMark bar = new BarMark(i, values[i])
                .CornerRadius(8f)
                .ForegroundStyle(PlottableValue.Value("Month", labels[i]));
            bar.CategoryLabel = labels[i];
            builder.Add(bar);
        }

        Chart chart = builder
            .ChartTitle("Monthly Sales")
            .ChartSubtitle("Current fiscal year")
            .ChartXAxis(x => x.Label("Month"))
            .ChartYAxis(y => y.Label("Sales").TickFormat("F0"))
            .ChartLegend(LegendPosition.Hidden)
            .Animation(Animation.Default.Delay(0.05f))
            .Build();

        _graphic = ChartCanvasHelper.RenderToRectTransform(
            chart, GetComponent<RectTransform>(), true, "Monthly Sales");
    }

    private void OnDestroy()
    {
        ChartCanvasHelper.RemoveChart(_graphic);
    }
}

Horizontal bars

Horizontal bars are not a separate ChartType. They are regular BarMark data with horizontal orientation. In the Inspector, use Bar Orientation. In code, either assign BarLayout.Horizontal explicitly or bind a numeric X value with a categorical Y value as shown below.

BarMark bar = new BarMark(
    PlottableValue.Value("Sales", value),
    PlottableValue.Value("Category", "Long category name"))
    .CornerRadius(6f);