Coloring scatter plot points differently based on certain conditions

Question

I have a scatter plot made using plotly.py and I would like to color certain points in the scatter plot with a different color based on a certain condition. I have attached a sample code below :

import plotly.plotly as py
import plotly.graph_objs as go
from plotly.offline import plot

data = [4.1, 2.1, 3.1, 4.4, 3.2, 4.1, 2.2]

trace_1 = go.Scatter(
    x = [1, 2, 3, 4, 5, 6, 7],
    y = data
)

layout = go.Layout(
    paper_bgcolor='rgb(255,255,255)',
    plot_bgcolor='rgb(229,229,229)',
    title = "Sample Plot",
    showlegend = False,
    xaxis = dict(
        mirror = True,
        showline = True,
        showticklabels = True,
        ticks = 'outside',
        gridcolor = 'rgb(255,255,255)',
    ),
    yaxis = dict(
        mirror = True,
        showline = True,
        showticklabels = False,
        gridcolor = 'rgb(255,255,255)',
    ),
    shapes = [{
            'type': 'line',
            'x0': 1,
            'y0': 4,
            'x1': len(data),
            'y1': 4,
            'name': 'First',
            'line': {
                'color': 'rgb(147, 19, 19)',
                'width': 1,
                'dash': 'longdash'
            }
        }, 
        {
            'type': 'line',
            'x0': 1,
            'y0': 3,
            'x1': len(data),
            'y1': 3,
            'line': {
                'color': 'rgb(147, 19, 19)',
                'width': 1,
                'dash': 'longdash'
            }
        }
    ]
)

fig = dict(data = [trace_1], layout = layout)
plot(fig, filename = "test_plot.html")

Here's the output Output Scatter plot

Here the long dashed horizontal lines have corresponding x values 4 & 3 respectively. As one can see, points 1, 2, 4, 6 and 7 lie outside the dashed lines. Is there a way to color them differently based on the condition (x > 3) and (x<4).

Here's a reference to something I found while searching for a solution : Python Matplotlib scatter plot: Specify color points depending on conditions

How can I achieve this in plotly.py ?

Answer 1

You can accomplish this by using a numeric array to specify the marker color. See https://plot.ly/python/line-and-scatter/#scatter-with-a-color-dimension.

Adapting your particular example to display red markers below 3, green markers above 4, and gray markers between 3 and 4:

import plotly.graph_objs as go
from plotly.offline import init_notebook_mode, iplot
init_notebook_mode()

data = [4.1, 2.1, 3.1, 4.4, 3.2, 4.1, 2.2]

color = [
    -1 if v < 3 else 1 if v > 4 else 0
    for v in data
]

colorscale = [[0, 'red'], [0.5, 'gray'], [1.0, 'green']]

trace_1 = go.Scatter(
    x = [1, 2, 3, 4, 5, 6, 7],
    y = data,
    marker = {'color': color,
              'colorscale': colorscale,
              'size': 10
             }
)

layout = go.Layout(
    paper_bgcolor='rgb(255,255,255)',
    plot_bgcolor='rgb(229,229,229)',
    title = "Sample Plot",
    showlegend = False,
    xaxis = dict(
        mirror = True,
        showline = True,
        showticklabels = True,
        ticks = 'outside',
        gridcolor = 'rgb(255,255,255)',
    ),
    yaxis = dict(
        mirror = True,
        showline = True,
        showticklabels = False,
        gridcolor = 'rgb(255,255,255)',
    ),
    shapes = [{
            'type': 'line',
            'x0': 1,
            'y0': 4,
            'x1': len(data),
            'y1': 4,
            'name': 'First',
            'line': {
                'color': 'rgb(147, 19, 19)',
                'width': 1,
                'dash': 'longdash'
            }
        }, 
        {
            'type': 'line',
            'x0': 1,
            'y0': 3,
            'x1': len(data),
            'y1': 3,
            'line': {
                'color': 'rgb(147, 19, 19)',
                'width': 1,
                'dash': 'longdash'
            }
        }
    ]
)

fig = dict(data = [trace_1], layout = layout)
iplot(fig)

Hope that helps!