Debug GUI Graph (C#)

Simple and easy to use graphing debug utility.

Description

This is an upgraded port of the DebugGUI Graph asset for Godot 4.x .NET (C#).

DebugGUI Graph provides a way to debug continuous systems by providing an inspectable graphing GUI and logging overlay. It also provides an optional attribute-based abstraction for a one line injection into your existing code.

    // Works with regular fields
    [DebugGUIGraph(min: -1, max: 1, r: 0, g: 1, b: 0, autoScale: true)]
    float SinField;

    // As well as properties
    [DebugGUIGraph(min: -1, max: 1, r: 0, g: 1, b: 1, autoScale: true)]
    float CosProperty { get { return Mathf.Cos(time * 6); } }

    // Also works for expression-bodied properties
    [DebugGUIGraph(min: -1, max: 1, r: 1, g: 0.3f, b: 1)]
    float SinProperty => Mathf.Sin((time + Mathf.Pi / 2) * 6);

    // User inputs, print and graph in one!
    [DebugGUIPrint, DebugGUIGraph(group: 1, r: 1, g: 0.3f, b: 0.3f)]
    float mouseX;
    [DebugGUIPrint, DebugGUIGraph(group: 1, r: 0, g: 1, b: 0)]
    float mouseY;

Installation

Download the latest commit or the stable Release version.
Place the addons folder into your project root.
!! Build the project solution !! under MSBuild > Build > Build Project on the bottom of the editor.
- Failing to do this will prevent the plugin settings from being generated and won't auto-add DebugGUI to AutoLoad
Enable the plugin by going to Project > Project Settings > Plugins and checking Enable next to DebugGUI

Overview

UI Interaction

Dragging - Windows can be dragged with middle mouse button.
Scrubbing - You can check the values at any point on the graph by hovering over it with the mouse.
Freezing - Holding left mouse button on the graph window stops graph updates for easier scrubbing.
Disabling - Graphs can be toggled on/off by clicking their names.

Settings for changing colors and graph sizes are available in the project settings under DebugGui > Settings.

Graphing

A graph can be generated by adding the DebugGUIGraph attribute above any property or variable castable to float. Here you can specify the range of the graph (i.e. values at the top and bottom), the RGB color, and whether it should expand its range if a variable goes outside the range.

[DebugGUIGraph(group: 2, min: -200, max: 200, r: 0, g: 1, b: 0, autoScale: true)]
float playerXVelocity => LinearVelocity.X;

Alternatively, for more control, you can define and manage a graph manually. Graphs are referenced via an object key, which you then use to push new values to the graph.

    object myGraphKey = new object();

    public override void _Ready()
    {
        // Graph using this node as the key
        DebugGUI.SetGraphProperties(this, "My Graph", 0, 1, 0, Colors.Red, false);

        // Another graph with an arbitrary object key
        DebugGUI.SetGraphProperties(myGraphKey, "My Other Graph", 0, 1, 0, Colors.Blue, false);

        // Strings also work as keys
        DebugGUI.SetGraphProperties("my graph", "My Other Graph", 0, 1, 0, Colors.Green, false);
    }

    public override void _Process(double delta)
    {
        DebugGUI.Graph(this, (float)delta);
        DebugGUI.Graph(myGraphKey, (float)delta);
        DebugGUI.Graph("my graph", (float)delta);
    }

Graphs can be exported to json via DebugGUI.ExportGraphs().

Logging

Similar to the graphs, a persistent logged value can be generated by adding the DebugGUIPrint attribute above any property or variable. This attribute has no configurable settings. Attribute-derived logs will include the object and field name in its output.

[DebugGUIPrint]
float playerXVelocity => LinearVelocity.X;

Persistent logs may also be managed manually in the same way as graphs using arbitrary keys.

    public override void _Process(double delta)
    {
        DebugGUI.LogPersistent(this, $"Velocity: {LinearVelocity}");
        DebugGUI.LogPersistent("deltatime", $"Last delta: {delta}");
        DebugGUI.Log("This is a temporary log entry!");
    }

GDScript Support

Using DebugGUI Graph from GDScript requires Godot 4.2. GDScript does not support C#-style attribues, however the static methods of DebugGUI can be used manually from GDScript.

func _ready():
    DebugGUI.SetGraphProperties(self, "MyObject", 0.0, 10.0, 1, Color.WHITE, true)

func _process(_delta):
    DebugGUI.Graph(self, self.linear_velocity.length())

Contribution

If you spot a bug while using this, please create an Issue.

License

MIT License

DragonAxe/DebugGUIGraph