Can't plot heatmap with datetime x axis

Community Support
1

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
2

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:

Regards,
Rutger

···

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
3

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

···

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
4

Hey,

Its an interesting example. The type of customization you are after certainly hints towards using the low-level api. You would need to do the binning yourself, perhaps Pandas (with groupby) can help you here. You can find a quick example:

I’ve used constant bins of a day, but since i’m using ‘quads’ this can even be an irregular length as well. I have neglected the y-ticklabels, these should show the parameter.

I hope its helpful, regards,
Rutger

···

On Wednesday, October 26, 2016 at 10:58:50 AM UTC+2, [email protected] wrote:

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
5

Hi, thanks that’s incredibly helpful.

···

On Wednesday, 26 October 2016 13:07:23 UTC+1, Rutger Kassies wrote:

Hey,

Its an interesting example. The type of customization you are after certainly hints towards using the low-level api. You would need to do the binning yourself, perhaps Pandas (with groupby) can help you here. You can find a quick example:
http://nbviewer.jupyter.org/gist/RutgerK/a13e996c9b8ddaf1fa3a02bd77a713a8

I’ve used constant bins of a day, but since i’m using ‘quads’ this can even be an irregular length as well. I have neglected the y-ticklabels, these should show the parameter.

I hope its helpful, regards,
Rutger

On Wednesday, October 26, 2016 at 10:58:50 AM UTC+2, [email protected] wrote:

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
6

I’m still having trouble getting the parameters onto the y-axis, do you know why this would be?

E.g. if I do y_range=params where params is a list of parameters, the graph loads but I get the following error message when zooming:

Uncaught Error: Number property ‘start’ given invalid value: end_brick(…)

I also tried using TickFormatter:

def ticker(tick):
    return params[tick]

p.yaxis.formatter = FuncTickFormatter.from_py_func(ticker)

but get the following message:

ValueError: Function func may only contain keyword arguments.

···

On Wednesday, 26 October 2016 13:07:23 UTC+1, Rutger Kassies wrote:

Hey,

Its an interesting example. The type of customization you are after certainly hints towards using the low-level api. You would need to do the binning yourself, perhaps Pandas (with groupby) can help you here. You can find a quick example:
http://nbviewer.jupyter.org/gist/RutgerK/a13e996c9b8ddaf1fa3a02bd77a713a8

I’ve used constant bins of a day, but since i’m using ‘quads’ this can even be an irregular length as well. I have neglected the y-ticklabels, these should show the parameter.

I hope its helpful, regards,
Rutger

On Wednesday, October 26, 2016 at 10:58:50 AM UTC+2, [email protected] wrote:

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
7

Hey,

You’ve got me there, i left it out for a reason. I wasn’t able to get it working as well. From the categorical examples i’ve seen ‘y_range=params’ seem good. But indeed zooming breaks then. I thought that perhaps zooming would cause more or less then 3 ticks to appear, so i tried setting a fixed amount of ticks with “p.yaxis.ticker = FixedTicker(ticks=list(range(1,len(params)+1)))” . But that also seems to ‘reset’ the earlier set params and the ticklabels show up as numbers again.

Long story short, i have no idea. :frowning:

Regards,
Rutger

···

On Thursday, October 27, 2016 at 12:50:11 PM UTC+2, [email protected] wrote:

I’m still having trouble getting the parameters onto the y-axis, do you know why this would be?

E.g. if I do y_range=params where params is a list of parameters, the graph loads but I get the following error message when zooming:

Uncaught Error: Number property ‘start’ given invalid value: end_brick(…)

I also tried using TickFormatter:

def ticker(tick):
    return params[tick]

p.yaxis.formatter = FuncTickFormatter.from_py_func(ticker)

but get the following message:

ValueError: Function func may only contain keyword arguments.

On Wednesday, 26 October 2016 13:07:23 UTC+1, Rutger Kassies wrote:

Hey,

Its an interesting example. The type of customization you are after certainly hints towards using the low-level api. You would need to do the binning yourself, perhaps Pandas (with groupby) can help you here. You can find a quick example:
http://nbviewer.jupyter.org/gist/RutgerK/a13e996c9b8ddaf1fa3a02bd77a713a8

I’ve used constant bins of a day, but since i’m using ‘quads’ this can even be an irregular length as well. I have neglected the y-ticklabels, these should show the parameter.

I hope its helpful, regards,
Rutger

On Wednesday, October 26, 2016 at 10:58:50 AM UTC+2, [email protected] wrote:

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null
8

Maybe its a bug, this example, with a categorical x-axis, also fails when you zoom:
http://bokeh.pydata.org/en/latest/docs/gallery/boxplot_chart.html

And the ‘violin plot’ as well, but that’s a port from mpl/seaborn.

Regards,
Rutger

···

On Thursday, October 27, 2016 at 1:35:21 PM UTC+2, Rutger Kassies wrote:

I’m still having trouble getting the parameters onto the y-axis, do you know why this would be?

E.g. if I do y_range=params where params is a list of parameters, the graph loads but I get the following error message when zooming:

Uncaught Error: Number property ‘start’ given invalid value: end_brick(…)

I also tried using TickFormatter:

def ticker(tick):
    return params[tick]

p.yaxis.formatter = FuncTickFormatter.from_py_func(ticker)

but get the following message:

ValueError: Function func may only contain keyword arguments.

On Wednesday, 26 October 2016 13:07:23 UTC+1, Rutger Kassies wrote:

Hey,

Its an interesting example. The type of customization you are after certainly hints towards using the low-level api. You would need to do the binning yourself, perhaps Pandas (with groupby) can help you here. You can find a quick example:
http://nbviewer.jupyter.org/gist/RutgerK/a13e996c9b8ddaf1fa3a02bd77a713a8

I’ve used constant bins of a day, but since i’m using ‘quads’ this can even be an irregular length as well. I have neglected the y-ticklabels, these should show the parameter.

I hope its helpful, regards,
Rutger

On Wednesday, October 26, 2016 at 10:58:50 AM UTC+2, [email protected] wrote:

Thanks for this, unfortunately I would quite like to use the datetime axis because it’s quite useful when zooming - unless there is some other way of achieving this?
What I’m actually trying to do is plot a heatmap where the y axis is different parameters/columns in the data source, in the same way that you can plot a line graph and it uses different columns for different lines.

Ideally I need each row to have it’s own colour scheme and thresholds, e.g. for parameter 1 which might be the bottom row, if the value is below 30 it needs to be red, etc.

I may be better off plotting separate heat maps with just 1 row each.

I think this is an unconventional use of a heatmap so I may just have to use figure and rect instead, but I’m still struggling with the datetime axis using that method.

On Wednesday, 26 October 2016 09:41:58 UTC+1, Rutger Kassies wrote:

Hey Willem,

Its look as if the Heatmap chart has problems grouping the datetime objects to bins, which makes some sense since its a continues scale. I’m not sure if providing the ‘bins’ like some of the examples show might overcome this.
http://bokeh.pydata.org/en/latest/docs/reference/charts.html#bokeh.charts.attributes.AttrSpec.bins

But a workaround might be to convert the datetime objects to a string representation before passing it to the Heatmap chart, so something like this:

data = {
‘value’: [1, 2, 3, 4, 5, 6],
‘x’: [datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0),
datetime(2016, 10, 25, 0, 0),
datetime(2016, 10, 25, 8, 0),
datetime(2016, 10, 25, 16, 0)],
‘y’: [‘param1’, ‘param1’, ‘param1’, ‘param2’, ‘param2’, ‘param2’]
}
data[‘x’] = [x.strftime(‘%Y-%m-%d %H%M’) for x in data[‘x’]]
hm = HeatMap(data, x=‘x’, y=‘y’, values=‘value’, stat=None)

show(hm)

``

You can view the resulting plot at:
http://nbviewer.jupyter.org/gist/RutgerK/526057a3622395fa0a2bb33b115d5487

Regards,
Rutger

On Tuesday, October 25, 2016 at 6:33:35 PM UTC+2, [email protected] wrote:

'm trying to plot the following simple heatmap:

data = {
    'value': [1, 2, 3, 4, 5, 6],
    'x': [datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0),
          datetime(2016, 10, 25, 0, 0),
          datetime(2016, 10, 25, 8, 0),
          datetime(2016, 10, 25, 16, 0)],
    'y': ['param1', 'param1', 'param1', 'param2', 'param2', 'param2']
}
hm = HeatMap(data, x='x', y='y', values='value', stat=None)
output_file('heatmap.html')
show(hm)

Unfortunately it doesn’t render properly:

I’ve tried setting x_range but nothing seems to work.

I’ve managed to get something working with the following code:

d1 = data['x'][0]
d2 = data['x'][-1]

p = figure(
    x_axis_type="datetime", x_range=(d1, d2), y_range=data['y'],
    tools='xpan, xwheel_zoom, reset, save, resize,'
)

p.rect(
    source=ColumnDataSource(data), x='x', y='y', width=12000000, height=1,
)

However as soon as I try to use the zoom tool, I get the following errors in console:

Uncaught Error: Number property 'start' given invalid value:
Uncaught TypeError: Cannot read property 'indexOf' of null

Hey,

You’ve got me there, i left it out for a reason. I wasn’t able to get it working as well. From the categorical examples i’ve seen ‘y_range=params’ seem good. But indeed zooming breaks then. I thought that perhaps zooming would cause more or less then 3 ticks to appear, so i tried setting a fixed amount of ticks with “p.yaxis.ticker = FixedTicker(ticks=list(range(1,len(params)+1)))” . But that also seems to ‘reset’ the earlier set params and the ticklabels show up as numbers again.

Long story short, i have no idea. :frowning:

Regards,
Rutger

On Thursday, October 27, 2016 at 12:50:11 PM UTC+2, [email protected] wrote: