Help with Heatmap

Hello, what’s wrong this code?

    import pandas as pd
    import dash_html_components as html
    import dash_core_components as dcc
    import plotly.graph_objs as go

    app = dash.Dash('heatmap test')

    df = pd.read_csv('$
    df = df[df["Validace"] == True]

    df2 = pd.DataFrame()

    #prekopirovani validnich dat ze stareho dataframu do noveho
    df2 = df[["Cas", "Mistnost", "Rozdil"]].copy()

    app.layout = html.Div([ dcc.Graph( id = "heatmap", figure = go.Figure( data = [go.Heatmap(z=df[["Rozdil"]], x=df[["Cas"]], y=df[["Mistnost"]])]))])

    if __name__ == '__main__':

Hey, don’t know what’ wrong with your code but here is the one I use to create heatmap.

I swap all lines in order to have a classical cross-correlation matrix

class GraphBuilder:

def __init__(self):

def heatmap_displayer(cls, time, freq, assets):

    def swap_list(list_to_swap):

        def swap_two_cols(l, el1, el2):
            stock_el = l[el1]
            l[el1] = l[el2]
            l[el2] = stock_el
            return l

        list_copy = list_to_swap.copy()                                                                                  
        for i in range(0, int(len(list_copy) / 2)):                 
            swap_two_cols(list_copy, i, len(list_copy) - 1 - i)     
        return list_copy                                                                                                 

    title = 'Cross-Correlation Matrix'
    id_graph = 'Cross_co_matrix'

    cross_corr_matrix = GetDataFromApi.get_data_for_cross_co_matrix(time, freq, False, assets)['cross_correlation_matrix']

    # swap to format the matrix for dash heatmap, where first cell is bottom left instead of top left for conventional matrices
    data = [{
        'z': swap_list(cross_corr_matrix),
        'x': assets,
        'y': swap_list(assets),
        'type': 'heatmap',
        'text': cross_corr_matrix

    return cls.build_graph(data, title, id_graph)

def build_graph(data, title, id_graph):
    colors = {
        'background': '#FE8000',
        'text': '#F3F3F3',
        'font': '#9E9A1A'

    figure = go.Figure(
            # titlefont=dict(color=colors['text']),
            paper_bgcolor=colors['background'],  # contour du graph
            font={'color': colors['text']}  # couleur du texte du graph

    return [dcc.Graph(
        style={'display': 'block'},

Note that this is in the controleur part of an MVC app, the line

cross_corr_matrix = GetDataFromApi.get_data_for_cross_co_matrix(time, freq, False, assets)['cross_correlation_matrix']

is returning something like :

[[1.0, 0.5090724891692849, 0.31183837298901446],
 [0.5090724891692849, 1.0, 0.2677353735604394],
 [0.31183837298901446, 0.2677353735604394, 1.0]]
1 Like

After launch …

Well… I don’t know anything on what you want to display, so for me I can’t judge if the graph you display is good or not. and if it’s not, I can’t help you to format your data in a good way…

I guess you should have anything you need to display a graph with the plotly, dash documentations and the sample of code I provided.

If you have other question than “it does not work…”, I’ll try to be there. But for me if you can display a graph, but the content is not the one you expected there is three issues:

  • you don’t format the “good” way your data
  • the graph is good, but you didn’t expected that result and you consider it as wrong
  • the graph is good but the data selection is not

Can you see the dates? CSV file

Instead, based on the data provided, create a Heat Map?

X = “Cas”
Y = “Mistnost”
Z = “Rozdil”

have you verify with the debugger that your data are correct, that df[‘something’] is returning a python list and not a numpy list or I don’t know

Maybe plot another graph to verify if you have the expected result or I don’t know…