# Make a Dynamic Heat Map

**URL:** <https://community.plotly.com/t/make-a-dynamic-heat-map/5124>\
**Category:** 📊 Plotly Python\
**Created:** [July 27, 2017, 7:55pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124 "2017-07-27T19:55:06Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![YellowClothes](https://avatars.discourse-cdn.com/v4/letter/y/e5b9ba/32.png) [@YellowClothes](https://community.plotly.com/u/YellowClothes)\
**Post date:** [July 27, 2017, 7:55pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/1 "2017-07-27T19:55:07Z")

</div>

I want to make a dynamic heat map which changes with time. I use Python. Can I use the Plotly lib to achieve this?

---

<div class="post-metadata">

**Author:** ![empet](https://avatars.discourse-cdn.com/v4/letter/e/977dab/32.png) [@empet](https://community.plotly.com/u/empet)\
**Post date:** [July 27, 2017, 8:29pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/2 "2017-07-27T20:29:42Z")

</div>

@YellowClothes You can animate a heatmap using Python Plotly. Here is an example: [https://plot.ly/~empet/14138](https://plot.ly/~empet/14138) Click the Play button to activate it…

---

<div class="post-metadata">

**Author:** ![nirre](https://avatars.discourse-cdn.com/v4/letter/n/57b2e6/32.png) [@nirre](https://community.plotly.com/u/nirre)\
**Post date:** [October 23, 2017, 2:24pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/3 "2017-10-23T14:24:51Z")

</div>

What about animating a series of heatmaps objects from package plotly.graph\_objs.Heatmap ? is that feasible with plotly ?

---

<div class="post-metadata">

**Author:** ![empet](https://avatars.discourse-cdn.com/v4/letter/e/977dab/32.png) [@empet](https://community.plotly.com/u/empet)\
**Post date:** [October 23, 2017, 2:35pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/4 "2017-10-23T14:35:33Z")

</div>

@nirre Do you mean animating subplots of heatmaps?

---

<div class="post-metadata">

**Author:** ![nirre](https://avatars.discourse-cdn.com/v4/letter/n/57b2e6/32.png) [@nirre](https://community.plotly.com/u/nirre)\
**Post date:** [October 23, 2017, 2:44pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/5 "2017-10-23T14:44:57Z")

</div>

I have heatmap plots generated with pltly.graph\_objs as in this code snipet:  
from plotly.offline import plot  
import plotly.graph\_objs as go

dirpath = os.path.join(os.getcwd(), “weights\_visual\_raw\_data”)  
files = [s for s in os.listdir(dirpath) if os.path.isfile(os.path.join(dirpath, s))]

for i, epoch in enumerate(files):  
pkl\_file = open(os.path.join(os.getcwd(), “weights\_visual\_raw\_data”, epoch), ‘rb’)  
weights = pickle.load(pkl\_file)  
pkl\_file.close()  
weights = [x for x in weights if x]  
for l, layer in enumerate(weights):  
if l \>= len(weights)-2:  
layer\_weights = layer[0]  
else:  
layer\_weights = layer[1]  
trace = go.Heatmap(z=layer\_weights)  
data = [trace]  
plot(data, auto\_open=False, filename=os.path.join(os.getcwd(),  
“weights\_dynamic\_visualization”,  
“layer”+str(l),  
“weights\_epoch\_” + str(i)))  
In the end I need to play these plots in animation sequence (maybe with a slider that can iterate between different heamaps)

---

<div class="post-metadata">

**Author:** ![empet](https://avatars.discourse-cdn.com/v4/letter/e/977dab/32.png) [@empet](https://community.plotly.com/u/empet)\
**Post date:** [October 23, 2017, 4:34pm UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/6 "2017-10-23T16:34:13Z")

</div>

Yes, you can define the list of frames consisting in data that you plot successively, in the code above.

---

<div class="post-metadata">

**Author:** ![nirre](https://avatars.discourse-cdn.com/v4/letter/n/57b2e6/32.png) [@nirre](https://community.plotly.com/u/nirre)\
**Post date:** [October 24, 2017, 4:26am UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/7 "2017-10-24T04:26:45Z")

</div>

Could you please demonstrate with a code snippet ? thanks

---

<div class="post-metadata">

**Author:** ![nirre](https://avatars.discourse-cdn.com/v4/letter/n/57b2e6/32.png) [@nirre](https://community.plotly.com/u/nirre)\
**Post date:** [October 24, 2017, 5:27am UTC](https://community.plotly.com/t/make-a-dynamic-heat-map/5124/8 "2017-10-24T05:27:18Z")

</div>

Also, I’m struggling to understand is whether I need to define columns and a grid for my heatmaps plot or can I just assign each frame with the plot as in  
trace = go.Heatmap(z=layer\_weights)  
data = [trace]  
plot(data, auto\_open=False, filename=’./’).

In case I need to define columns and grid, how to I define a column for a plotly.graph\_objs heatmap object ?