Heatmap with dendrogram not working

I am trying to replicate the sample here…

I get this error…

AttributeError Traceback (most recent call last)
in ()
11 # Add Side Dendrogram Data to Figure
—> 12 figure[‘data’].extend(dendro_side[‘data’])
14 # Create Heatmap

AttributeError: ‘tuple’ object has no attribute ‘extend’

At this point, the figure[‘data’] and the dendro_side[‘data’] are both tuples, not lists, so extend will not work.

I have tried this instead.

figure['data'] = figure['data'] + dendro_side['data']

But then I get another error.

ValueError: The data property of a figure may only be assigned a list or tuple that contains a permutation of a subset of itself

What is the right pattern here?

Ok figured it out. Figure () has methods for adding traces.


Happy to raise a PR if somebody can point out the location of the doco

I do actually have quite a fancy full working example of a Clustermap with configuration options for row/column dendrograms etc… where is the right place to share something like this?

I was going to do a figurefactory and PR but I haven’t gotten around to it.

Hi @mdausmann-cmri,

Yeah, that example is out of date. Thanks for pointing it out. Could you raise an issue on the documentation repo here at https://github.com/plotly/documentation/tree/source-design-merge ?

And, if you’re so inclined a PR with the notebook fixed would be appreciated!

Also, your clustermap solution sounds nice. I’d recommend making it a gist (https://gist.github.com/) and then creating a new forum thread with the link and some examples and screenshots. This could be a nice way to get some feedback from the community and even start down the path towards making it a figure factory.


If you don’t mind sharing, I’d really appreciate being able to work from your example.


Hey @cfriedline and @jmmease!

Here is the full and functionning example with offline plotly. I will post on Github using the link by @jmmease.

The three key lines are :
plotly.offline.iplot(figure, filename=‘dendrogram_with_heatmap’)

get data

data = np.genfromtxt(“http://files.figshare.com/2133304/ExpRawData_E_TABM_84_A_AFFY_44.tab”,
names=True,usecols=tuple(range(1,30)),dtype=float, delimiter="\t")
data_array = data.view((np.float, len(data.dtype.names)))
data_array = data_array.transpose()
labels = data.dtype.names

Initialize figure by creating upper dendrogram

figure = ff.create_dendrogram(data_array, orientation=‘bottom’, labels=labels)
for i in range(len(figure[‘data’])):
figure[‘data’][i][‘yaxis’] = ‘y2’

Create Side Dendrogram

dendro_side = ff.create_dendrogram(data_array, orientation=‘right’)
for i in range(len(dendro_side[‘data’])):
dendro_side[‘data’][i][‘xaxis’] = ‘x2’

Add Side Dendrogram Data to Figure


Create Heatmap

dendro_leaves = dendro_side[‘layout’][‘yaxis’][‘ticktext’]
dendro_leaves = list(map(int, dendro_leaves))
data_dist = pdist(data_array)
heat_data = squareform(data_dist)
heat_data = heat_data[dendro_leaves,:]
heat_data = heat_data[:,dendro_leaves]

heatmap = [
x = dendro_leaves,
y = dendro_leaves,
z = heat_data,
colorscale = ‘Blues’

heatmap[0][‘x’] = figure[‘layout’][‘xaxis’][‘tickvals’]
heatmap[0][‘y’] = dendro_side[‘layout’][‘yaxis’][‘tickvals’]


Edit Layout

figure[‘layout’].update({‘width’:800, ‘height’:800,
‘showlegend’:False, ‘hovermode’: ‘closest’,

Edit xaxisP

figure[‘layout’][‘xaxis’].update({‘domain’: [.15, 1],
‘mirror’: False,
‘showgrid’: False,
‘showline’: False,
‘zeroline’: False,

Edit xaxis2

figure[‘layout’].update({‘xaxis2’: {‘domain’: [0, .15],
‘mirror’: False,
‘showgrid’: False,
‘showline’: False,
‘zeroline’: False,
‘showticklabels’: False,

Edit yaxis

figure[‘layout’][‘yaxis’].update({‘domain’: [0, .85],
‘mirror’: False,
‘showgrid’: False,
‘showline’: False,
‘zeroline’: False,
‘showticklabels’: False,
‘ticks’: “”})

Edit yaxis2

figure[‘layout’].update({‘yaxis2’:{‘domain’:[.825, .975],
‘mirror’: False,
‘showgrid’: False,
‘showline’: False,
‘zeroline’: False,
‘showticklabels’: False,


plotly.offline.iplot(figure, filename=‘dendrogram_with_heatmap’)

Thanks, @ashmc! One small thing. Could you update your post to put the code in a fenced code block (https://help.github.com/articles/creating-and-highlighting-code-blocks/)? This way it will be easier for folks to copy and paste what you’ve done.