# TDrawStyle

An enumeration that defines how indicator values should be visually represented on the chart.

## Values

| Value             | Description                                                                          |
| ----------------- | ------------------------------------------------------------------------------------ |
| `NONE`            | No visual representation (used for calculation buffers)                              |
| `LINE`            | Draw as a continuous line                                                            |
| `HISTOGRAM`       | Draw as vertical bars (histogram)                                                    |
| `FILL`            | Fill the area between the current buffer and previous buffer                         |
| `SYMBOL`          | Use symbols to represent data points                                                 |
| `SECTION`         | Draw sections or segments of a line                                                  |
| `HISTOGRAM_FILL`  | Combine histogram and fill styles                                                    |
| `COLORED_CANDLES` | Display data using colored candlesticks (requires 4 buffers: Open, High, Low, Close) |

## Detailed Explanations

### FILL Style

The `FILL` draw style creates a filled area between two buffers:

* **Requires**: At least 2 buffers (current buffer and one previous buffer)
* **Behavior**: Fills the area between buffer `i-1` and buffer `i`
* **Buffer Index**: Must be buffer index 1 or higher (since it needs a previous buffer)

```typescript
// Example: Fill between two moving averages
this.api.IndicatorBuffers(2);

// Buffer 0: First line (e.g., upper band)
this.upperBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(0, this.upperBuffer);
this.api.SetIndexStyle(0, TDrawStyle.LINE, TPenStyle.SOLID, 1, "#0000ff");

// Buffer 1: Fill between buffer 0 and buffer 1
this.fillBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(1, this.fillBuffer);
this.api.SetIndexStyle(1, TDrawStyle.FILL, TPenStyle.SOLID, 1, "#80c0ff");
```

### COLORED\_CANDLES Style

The `COLORED_CANDLES` draw style displays candlestick charts with custom colors:

* **Requires**: Exactly 4 buffers in sequence (Open, High, Low, Close)
* **Buffer Order**:
  * Buffer `i-3`: Open values
  * Buffer `i-2`: High values
  * Buffer `i-1`: Low values
  * Buffer `i`: Close values (the buffer with COLORED\_CANDLES style)
* **Buffer Index**: Must be buffer index 3 or higher (since it needs 3 previous buffers)
* **Use Cases**: Custom candlestick indicators, price transformation indicators

```typescript
// Example: Custom colored candlesticks
this.api.IndicatorBuffers(4);

// Buffer 0: Open values
this.openBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(0, this.openBuffer);
this.api.SetIndexStyle(0, TDrawStyle.NONE, TPenStyle.SOLID, 1, "#000000"); // Hidden

// Buffer 1: High values
this.highBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(1, this.highBuffer);
this.api.SetIndexStyle(1, TDrawStyle.NONE, TPenStyle.SOLID, 1, "#000000"); // Hidden

// Buffer 2: Low values
this.lowBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(2, this.lowBuffer);
this.api.SetIndexStyle(2, TDrawStyle.NONE, TPenStyle.SOLID, 1, "#000000"); // Hidden

// Buffer 3: Close values + Candlestick display
this.closeBuffer = this.api.CreateIndexBuffer();
this.api.SetIndexBuffer(3, this.closeBuffer);
this.api.SetIndexStyle(
  3,
  TDrawStyle.COLORED_CANDLES,
  TPenStyle.SOLID,
  1,
  "#ff0000"
);
```

## Important Notes

### Buffer Dependencies

* **FILL**: Requires buffer index ≥ 1 (needs 1 previous buffer)
* **COLORED\_CANDLES**: Requires buffer index ≥ 3 (needs 3 previous buffers)
* Other styles can be used on any buffer index

### Buffer Setup Order

When using `FILL` or `COLORED_CANDLES`, ensure you:

1. Create all required buffers in sequence
2. Set the dependent style on the correct buffer index


---

# Agent Instructions: 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:

```
GET https://fto-2.gitbook.io/fto-indicators-docs/types/draw-style.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.