Besides the different colour values in TradingView we can also ‘turn off’ a colour. How does that work in TradingView Pine?

In this article:

Disabling the colours of a TradingView script programmatically

In TradingView Pine scripts we can use a range of colours, from basic TradingView colours to any of the hexadecimal colour values. After we’ve used a colour in Pine, we can also change the script’s colours manually. But how do we programmatically turn off colours?

We specify a certain colour with the color argument of several TradingView functions, such as plot() when plotting data and barcolor() when colouring the chart’s price bars. However, we can also set that color argument to na. That value has the effect of applying the same colour as the chart already has (Pine Script Language Tutorial, n.d.), and such a transparent colour makes it look like colouring is ‘turned off’.

That na built-in variable represents a “not a number” (NaN) value (TradingView, n.d.). Such NaN values are also used with programming languages like C# where they’re the result of unusual mathematical operations (dividing zero with zero and subtracting infinity from infinity; Albahari & Albahari, 2012; Sharp, 2013). A NaN value is also sometimes used to represent a special value, and that’s the case in TradingView too with na being an invisible colour.

Applying a fully transparent colour conditionally

The use of TradingView’s na variable to apply a transparent colour is closely related with applying colours conditionally. That’s because there’s little reason to use a function that colours something if we set that function’s colour to transparency on every bar. After all, in that case we might as well not code that function into our script.

There are several ways in which we can set TradingView colours conditionally:

In the programming example below we’ll use the conditional ternary operator (?:) for applying transparent colours.

Note: Most, but not all, TradingView functions that work with colours also accept a conditionally set colour (including na for transparency). The functions that can conditionally ‘turn off’ their colours with na are barcolor(), bgcolor(), plot(), plotarrow(), plotbar(), plotcandle(), plotchar(), and plotshape(). The functions that do not accept conditional colours are fill() and hline() (TradingView, n.d.).

Creating a MACD indicator with optional transparent colours

In the example below we create a MACD (Moving Average Convergence Divergence) indicator that plots the difference between two moving averages as well a signal line that generates buy and sell signals (Pring, 2002). We code the script so that the na variable can conditionally ‘turn off’ the histogram and coloured price bars. After discussing the code, we’ll look at the script’s input options and the indicator itself. But first, the code:

study(title="Using na to turn off colours", overlay=false)

// Inputs
fastLen     = input(title="Fast Length", type=integer, defval=12)
slowLen     = input(title="Slow Length", type=integer, defval=26)
smoothLen   = input(title="Smoothing Length", type=integer, defval=9)
showHist    = input(title="Show Histogram?", type=bool, defval=true)
showSignals = input(title="Show Signals?", type=bool, defval=false)

// Get MACD values
[macdLine, signalLine, histValues] = macd(close, fastLen, slowLen, smoothLen)

// Plot lines
plot(series=macdLine, color=blue)
plot(series=signalLine, color=orange)
hline(price=0, linestyle=dotted)

plot(series=histValues, color=iff(showHist, #00C78C, na), 
     style=histogram, linewidth=3)

// Colour signal bars
barColour = 
    (showSignals and crossover(macdLine, signalLine)) ? #00FF7F :
    (showSignals and crossunder(macdLine, signalLine)) ? yellow :
    na

barcolor(color=barColour)

The script starts with study(), a required function for every indicator (Pine Script Language Tutorial, n.d.). We set two of this function’s arguments: title (which specifies the script name) and overlay. That argument, when set to false, displays the indicator in a separate subchart as opposed to overlaid on the chart’s instrument (TradingView, n.d.).

Then we add the script’s input options:

fastLen     = input(title="Fast Length", type=integer, defval=12)
slowLen     = input(title="Slow Length", type=integer, defval=26)
smoothLen   = input(title="Smoothing Length", type=integer, defval=9)
showHist    = input(title="Show Histogram?", type=bool, defval=true)
showSignals = input(title="Show Signals?", type=bool, defval=false)

The input() function creates a manual input setting in the script’s ‘Inputs’ window (see image further down below), and it also returns the input’s current value (TradingView, n.d.). Here store those values in a variable with the assignment operator (=). That way we can use the input’s value later on by referring to the variable.

The first three input options are use for calculating the MACD and are all numerical integer inputs. We make those by setting the type argument of the input() function to integer (Pine Script Language Tutorial, n.d.). We set the title argument of the first to “Fast Length” and this name is what’s placed before the input option. This input has a default value (defval) of 12 and its value is stored in the fastLen variable. The next input is named “Slow Length” and starts off with a value of 26, and we use the slowLen variable to track its value. The third and last whole number input is named “Smoothing Length” with a default value of 9 and its value stored in the smoothLen variable.

The two other inputs are Boolean true/false inputs. These add a checkbox to the script’s settings and are made by setting the input() function’s type argument to bool (Pine Script Language Tutorial, n.d.). The first of these has its title set to “Show Histogram?” and is enabled by default (defval=true). This input’s current value is stored in showHist and that variable is used later on to ‘turn off’ the MACD histogram colour. The other checkbox input is named “Show Signals?” with a default value of false and its current value stored in the showSignals variable. That variable is used later on when colouring the price bars or ‘turning off’ those coloured bars.

Then we compute the MACD itself:

[macdLine, signalLine, histValues] = macd(close, fastLen, slowLen, smoothLen)

We calculate the MACD with the macd() function that requires four arguments: a series of values to compute on and the fast length, slow length, and signal length values (TradingView, n.d.). Here we set these to close (to calculate on closing prices) and the fastLen, slowLen, and smoothLen input variables with default values of 12, 26, and 9 respectively.

TradingView functions typically return one value, but the macd() function returns an array with three values: the MACD, signal line, and histogram values (TradingView, n.d.). Here we store those series in the macdLine, signalLine, and histValues variables for use later on in the script. Since macd() returns an array, those variables are placed in square brackets ([ and ]) and separated with commas.

Next we plot the MACD values on the chart:

plot(series=macdLine, color=blue)
plot(series=signalLine, color=orange)
hline(price=0, linestyle=dotted)

plot(series=histValues, color=iff(showHist, #00C78C, na), 
     style=histogram, linewidth=3)

We first use plot() to display the MACD and its signal line. That function plots the data of its series argument as a line by default (TradingView, n.d.). We set that argument in the first plot() statement to the macdLine variable and set the color argument to the blue basic TradingView colour to plot these MACD values as a blue line. With the next plot() function call we display the signalLine values as an orange line.

Then we use hline(), a function that draws a horizontal line at a fixed price level (TradingView, n.d.), to make a line at 0. That line is only added to the script for visual reasons because it looks nice when the MACD histogram bars are grounded on a zero line.

Those histogram bars are made by the last plot() statement, which has its series argument set to the histValues variable. With the style argument set to histogram we create a histogram plot (TradingView, n.d.). Those histogram bars are one step removed from the thickest bar possible with the linewidth argument set to 3 (TradingView, n.d.).

The color argument of this last plot() function call is set to a value returned by the iff() function. This function requires three arguments: a true/false condition and two values. The first of those values is returned when the condition is true while the second is returned whenever the condition evaluates to false (Pine Script Language Tutorial, n.d.).

The condition that’s evaluated here is the showHist true/false input variable, which holds a value of true when the “Show Histogram?” option is enabled and false when that option is turned off. With that input enabled, iff() returns #00C78C (the hexadecimal colour value of turquoise blue). And with that checkbox disabled, iff() returns the na value. That way we conditionally ‘turn off’ the histogram whenever the “Show Histogram?” input option is disabled.

Now that we have the MACD values plotted, we’re going to see if we should colour the price bars for any buy or sell signals:

barColour = 
    (showSignals and crossover(macdLine, signalLine)) ? #00FF7F :
    (showSignals and crossunder(macdLine, signalLine)) ? yellow :
    na

barcolor(color=barColour)

We create the barColour variable here and assign it a value with up to two conditional (ternary) operators (?:). This operator works like the iff() function: it also evaluates a true/false condition and, when the condition is true, returns the first of the other two values while the last value is returned whenever the condition is false (Pine Script Language Tutorial, n.d.).

The condition of the first conditional operator consists out of two expressions: the showSignals input variable (which holds true whenever the “Show Signals?” input is enabled and is false otherwise) and the value returned by crossover(). That function returns true whenever the value of its first argument crossed over the second argument on the current bar (compared to the previous), and crossover() returns false in all other cases (TradingView, n.d.).

We use crossover() with the macdLine and signalLine variables, and so it returns true whenever the MACD line crosses above its signal line (and returns false when that didn’t happen). Because the showSignals variable and the crossover() function are combined here with the and logical operator, the value of both operators need to be true before the entire condition is also true (Pine Script Language Tutorial, n.d.).

When the “Show Signals?” input option is indeed enabled and the MACD line crossed above its signal line, then the conditional operator returns the #00FF7F hexadecimal colour value of spring green. We then assign that colour to the barColour variable for user later on in the script.

When one or both expressions are false – so “Show Signals?” is disabled and/or the MACD didn’t cross above its signal line – the second conditional operator is processed. This conditional operator also checks if showSignals is true, but also requires that the crossunder() function with the macdLine and signalLine variables passed in returns true. This function returns that true value whenever the value of its first argument drops below the second argument on the current bar, while on the previous bar the first argument’s value was higher than that of the second (TradingView, n.d.).

Since we again use the and logical operator to combine both expressions, they both need to be true before the entire condition of this second conditional operator is true also. And so when the “Show Signals?” input option is enabled and the MACD drops below its signal line, only then will the conditional operator return the yellow basic TradingView colour which is then stored in the barColour variable.

But when the condition of the second conditional operator also isn’t true, then we know that neither a cross over nor a cross under happened with the “Show Signals?” input enabled. In that case our last conditional operator returns na, and we store that value then in the barColour variable. This way we ‘turn off’ the colouring when no MACD signal happened and/or when the “Show Signals?” option is disabled.

The last statement of our example colours TradingView price bars with the barcolor() function (TradingView, n.d.). We set this function’s color argument to barColour, the variable which we’ve just assigned the spring green, yellow, or na value.

Turning off a TradingView script’s colours programmatically

When we add our example indicator to a FTSE 100 Index CFD, it looks like:

Colouring conditionally in TradingView Pine

The script’s input options are the following:

Input options of the TradingView script

When we disable the “Show Histogram?” option, we can see how na ‘turns off’ our histogram:

Turning off a histogram plot in TradingView

Even though the histogram bars aren’t visible anymore, the value of the last bar (-12.7046) is still displayed on the indicator’s price axis. That shows that na makes the plot invisible but doesn’t actually remove it from the chart.

When we enable the “Show Signals?” input option, the coloured price bars show up while they were previously ‘turned off’ with na:

Colouring price bars in TradingView

Of course, when we enable the “Show Histogram?” again the histogram bars reappear:

Plotting a coloured histogram and price bars in TradingView

To learn more on using colours conditionally, see setting TradingView colours with the conditional ternary operator, using conditional colours with the iff() function, and setting colours with if/else statements. The kind of colours that we can use in TradingView are the basic TradingView colours as well as the hexadecimal colour values.

Summary

Colours can be applied in TradingView script on every bar or ‘turned off’ conditionally whenever a certain condition happens. For that we evaluate a true/false condition with the conditional ternary operator (?:), the iff() function, or with an if/else statement. Then, depending on the condition, we can return a TradingView colour or hexadecimal colour value, or na instead. That built-in variable returns a “not a number” value which, in the context of colouring programmatically, gives a fully transparent effect which makes it looks like colouring is turned off.


References

Albahari, J. & Albahari, B. (2012). C# 5.0 in a Nutshell: The Definitive Reference (5th edition). Sebastopol, CA: O’Reilly Media.

Pine Script Language Tutorial (n.d.). Retrieved on October 23, 2015, from https://docs.google.com/document/d/1sCfC873xJEMV7MGzt1L70JTStTE9kcG2q-LDuWWkBeY/

Pring, M.J. (2002). Technical Analysis Explained (4th edition). New York, NY: McGraw-Hill.

Sharp, J. (2013). Microsoft Visual C# 2013 Step by Step. Microsoft Press.

TradingView (n.d.). Script Language Reference Manual. Retrieved on February 4, 2016, from https://www.tradingview.com/study-script-reference/