Coloring with NinjaScript

Brief Introduction

We’ve put together a series of posts to help you in your journey to learn how to program from scratch, or edit existing NinjaTrader indicators and strategies. All of our posts are geared toward the non-programmer, so even though we will present a lot of information, for all of you more technical people out there, we will not go into all the technicalities of C#, NinjaTrader, or NinjaScript. It’s also important to note that even though we show you how to do something in NinjaTrader, that is by no way the only way to do it. We will present what has worked best for us and what will be most easily understood by someone learning how to program. Finally, for the more advance users, we are going to leave things out and over simplify certain parts because we are focused on learning what we need to so we can get started on our NinjaScript journey.

In this part we will build upon Part 9 and add logic to our indicator to define when and what color our plots and background should be, under defined conditions. We will also review the NinjaTrader references PlotBrushes, BackBrush, and BackBrushAll.

PlotBrushes Basics

Coloring NinjaTrader Plots is extremely easy, but first, if you have not reviewed Part 9, please review that tutorial as we covered logic related to Plots and Values we will build upon in this tutorial. PlotBrushes will allow us to control the color of a plot in real-time (and historically) using the exact same syntax as Values–PlotBrushes[index][barsago]. It is important to note that this will ONLY color the plot for the specified barsago. Like most of our tutorials, the best way to learn PlotBrushes is through an example, so let’s get started by declaring two brushes (i.e. colors) for each Plot–each plot will have a brush that defines the up and down color (we will cover Brush / Brushes in more depth in a later tutorial):

Next, we need to create logic for when we want to color each plot, which in our case, we want to color both Plots based on where the Fast MA is in relation to the Slow MA (i.e. when the Fast MA is greater than the Slow MA, color using iBrushPlot0Up or iBrushPlot1Up). To do that we can compare the current value (BarsAgo == 0) of FastMA and SlowMA:

Let’s review the logic above a little more. We used PlotBrushes[index][barsago]. Remember, Plots[0] / Values[0] refers to the first AddPlot() and Plots[1] / Values[1] refers to the second AddPlot(). Using the same logic, we can refer to the color of Plots[0] / Values[0] by using PlotBrushes[0]. Now, when we define bars ago (second 0 inside of []), PlotBrushes[0][0], we are telling NinjaTrader to color Plots[0] iBrushPlot0Up / iBrushPlot0Down 0 BarsAgo (i.e. the right most bar). If we wanted to repaint the indicator we could color the bar to the left of the right most bar (i.e. 1 BarsAgo) by using this syntax: PlotBrushes[0][1] = iBrushPlot0Up. Please note that I do not suggest repainting colors–if you run into a situation where you need to change values historically, it is better to change the values historically in a separate Series, but it is always best to keep Plots / Values / PlotBrushes painting like you would see them in real time, which helps people from coming to false conclusions about the viability of indicator signals. With the new PlotBrushes logic, our indicator should now look like this:

BackBrush / Back Brushes Basics

When we color the background on a NinjaTrader chart, we have several options–we can color just the panel where our indicator is located, or we can color any panel that is loaded (e.g. in our case, if we loaded a CCI on our chart and wanted to color the panel where our MAs are located and the CCI is loaded, we can do that, or we can color only where our indicator is located). The options for coloring background are:

• BackBrush: This will color the right most bar (BarsAgo == 0) AND only color the background of the panel where your indicator is located. Syntax: BackBrush = Brushes.Color;
• BackBrushAll: This will color the right most bar (BarsAgo == 0) AND color the background for ALL the panels on your chart. Syntax: BackBrushAll = Brushes.Color;
• BackBrushes: This will color the background based on a user input of BarsAgo AND only color the background of the panel where your indicator is located. Syntax: BackBrushes[barsago] = Brushes.Color;
• BackBrushesAll: This will color the background based on a user input of BarsAgo AND color the background for ALL the panels on your chart. Syntax: BackBrushesAll[barsago] = Brushes.Color;

If you are a little unsure how each will be used, don’t worry we are about to go through a great example, but first we need to define two brushes for our background as follows–we are going to also declare a variable for Opacity so when we use the same color for the Plot and Background, the Plot will still be visible:

Great, now before we use any of the background logic, we need to set the opacity for our Brushes and Freeze them so we don’t run into performance issues as well as run out of brushes (we will cover this in more detail in a later tutorial):

Now that we have Brushes declared, let’s start using logic to color our background. The first thing we will do is use BackBrush to color the background depending on where the FastMA is in relation to the SlowMA (same logic as PlotBrushes). Next, we will determine if it’s the first time the FastMA is greater than the SlowMA by using this logic: if(FastMA[1] <= SlowMA[1]). What that statement says is if FastMA 1 BarsAgo was less than or equal to SlowMA 1 BarsAgo then evaluate the next statement (i.e. if on the CurrentBar (BarsAgo == 0) we are in an up trend, but 1 BarsAgo we were in a down trend (or no trend) then evaluate the next statement).  The next statement uses BackBrushesAll[barsago] to paint the background–I do not suggest keeping this logic, but it demonstrates [barsago] logic along with painting all the panels on your chart. The above logic looks like:

Now it’s time to see how this looks on a chart, so save, compile, and add a CCI to your chart:

Our indicator’s code should now look like this:

It’s As Simple As That

We are going to continue using the example from above to Draw when we have a change in trend, so checkout Part 11 – Drawing Basic Chart Objects.