> For the complete documentation index, see [llms.txt](https://help.optimusflow.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.optimusflow.app/quantower-algo/indicator-with-custom-painting-gdi.md).

# Indicator with custom painting (GDI)

## Introduction

In this topic, we will show you how to use a really great possibility of scripts in OptimusFLOW — a custom painting on the Chart. You can draw anything you need via GDI+ — a graphical subsystem of Windows. In C# all features from GDI+ are encapsulated in class Graphics. It is a set of functions allowing to create graphical primitives and splines using brushes and pens, Images, etc. More information you can find on the [Microsoft documentation site](https://docs.microsoft.com/ru-ru/dotnet/api/system.drawing.graphics?redirectedfrom=MSDN\&view=netframework-4.7.2).

## Access Graphics object

Let's start. To get access to Graphics object of the chart you need to override **OnPaint** method and use **Hdc** value from its parameters:

```csharp
public override void OnPaintChart(PaintChartEventArgs args)
{
    // Use args.Hdc to create Graphics which give us acces to chart canvas
    Graphics gr = Graphics.FromHdc(args.Hdc);                        

    // Add your custom drawings here...
}
```

That's all - now you have full access to chart's canvas and can draw anything you want. For drawing in C# you need to call special methods with graphical parameters: coordinates, color, width, etc.:

```csharp
public override void OnPaintChart(PaintChartEventArgs args)
{
    Graphics gr = Graphics.FromHdc(args.Hdc);

    // Draw a line using predefined Red pen
    gr.DrawLine(Pens.Red, 100,100,200,200);

    // Draw a rectangle using predefined Blue pen
    gr.DrawRectangle(Pens.Blue, 250, 100, 100, 100);

    // Fill a rectangle using predefined yellow brush
    gr.FillRectangle(Brushes.Yellow, 400, 100, 100, 100);            

    // Create a custom pen and use it for drawing
    Pen myPen = new Pen(Color.Green, 3);
    gr.DrawRectangle(myPen, 50, 50, 500, 200);
}
```

If we build this indicator - we can see the result on the chart window:

![Drawing directly on the chart](/files/-Lvqvo4Xluh6T4hqmpui)

## Drawing a simple text

Let's try to draw a text — it is very similar. We need to specify text, font, and coordinates:

```csharp
public override void OnPaintChart(PaintChartEventArgs args)
{
    Graphics gr = Graphics.FromHdc(args.Hdc);

    // Draw the text with specified font and color
    gr.DrawString("An examle if drawing text...", new Font("Arial", 20), Brushes.Red, 100, 100);    
}
```

Build this and check your chart:

![Drawing a text](/files/-Lvqvo4ZnoPL-Qw7LHsq)

## Market depth levels on chart

Ok, it is interesting but quite useless. Let's do something more serious — for example, display all levels of market depth on the chart. This is source code:

```csharp
protected override void OnInit()
{
    // Subscribe for level 2 quotes            
    this.Symbol.Subscribe(SubscribeQuoteType.Level2);
}

public override void OnPaintChart(PaintChartEventArgs args)
{
    Graphics gr = Graphics.FromHdc(args.Hdc);

    // Create a font
    Font font = new Font("Arial", 10);

    // Request a current sorting bids
    List<Level2Item> sortedBids = this.Symbol.Bids.GetSortedList();

    // Draw bids
    for (int i = 0; i < sortedBids.Count; i++)
        gr.DrawString(sortedBids[i].Quote.Price.ToString(), font, Brushes.LightGray, 20, 23 * i + 30);

    // Request a current sorting asks
    List<Level2Item> sortedAsks = this.Symbol.Asks.GetSortedList();

    // Draw asks
    for (int i = 0; i < sortedAsks.Count; i++)
        gr.DrawString(sortedAsks[i].Quote.Price.ToString(), font, Brushes.LightGray, 100, 23 * i + 30);     
}
```

And this is how our chart looks now. You can compare results with Market Depth panel in OptimusFLOW:

![Display bids and asks on the chart](/files/-Lvqvo4a7UVEN3at04w1)

It is a great possibility of chart features extending, isn't it? You can add your own Info Window, Track Cursor or even Volume Analysis visualization. There are no limitations in our API, only your fantasy.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://help.optimusflow.app/quantower-algo/indicator-with-custom-painting-gdi.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.