CODEWITHSUNDEEP
pythonpandasplotlyplotly-dash
Emm
Emm

Reputation: 2507

Custom sorting axis in plotly heatmap

I would like to sort the xaxis of my heatmap in such a way that is in the same order as my yaxis. This means that the order would appear in such a way that the youngest age range appears first and each axis that appears thereafter is an incremental increase

Here is a sample of my data:

{'age_range': {0: '15-20',
  1: '15-20',
  2: '20-25',
  3: '20-25',
  4: '20-25',
  5: '20-25',
  6: '20-25',
  7: '20-25',
  8: '20-25',
  9: '20-25'},
 'opp_age_range': {0: '25-30',
  1: '25-30',
  2: '20-25',
  3: '20-25',
  4: '20-25',
  5: '20-25',
  6: '25-30',
  7: '25-30',
  8: '25-30',
  9: '25-30'},
 'division': {0: 'cruiser',
  1: 'super feather',
  2: 'feather',
  3: 'light',
  4: 'super bantam',
  5: 'welter',
  6: 'cruiser',
  7: 'feather',
  8: 'heavy',
  9: 'super bantam'},
 'sex': {0: 'male',
  1: 'male',
  2: 'male',
  3: 'male',
  4: 'male',
  5: 'male',
  6: 'male',
  7: 'male',
  8: 'male',
  9: 'male'},
 'wins': {0: 6, 1: 15, 2: 9, 3: 30, 4: 7, 5: 25, 6: 14, 7: 28, 8: 45, 9: 21},
 'loss': {0: 7, 1: 11, 2: 35, 3: 28, 4: 21, 5: 46, 6: 18, 7: 34, 8: 50, 9: 32},
 'draw': {0: 2, 1: 2, 2: 2, 3: 1, 4: 1, 5: 2, 6: 1, 7: 7, 8: 2, 9: 3},
 'other': {0: 1, 1: 1, 2: 1, 3: 2, 4: 2, 5: 1, 6: 1, 7: 1, 8: 1, 9: 1},
 'total_fights': {0: 16,
  1: 29,
  2: 47,
  3: 61,
  4: 31,
  5: 74,
  6: 34,
  7: 70,
  8: 98,
  9: 57},
 'win_rate': {0: 37.5,
  1: 51.724137931034484,
  2: 19.148936170212767,
  3: 49.18032786885246,
  4: 22.58064516129032,
  5: 33.78378378378378,
  6: 41.17647058823529,
  7: 40.0,
  8: 45.91836734693878,
  9: 36.84210526315789}}

This is what my current outlook looks like:

pic

This is the code I have written thus far where fights contains some of the sample data I added in the first example:

 order = ['15-20', '20-25', '25-30', '30-35', '35-40', '40-45', '45-50']
    return {
        'data': [
            go.Heatmap(
                z=fights['win_rate'],
                y=fights['age_range'],
                x=fights['opp_age_range'],
                showscale=True)
        ],
        'layout': go.Layout(
            title='Wins rate by boxer age range',
            xaxis={'title':'Opposition age range'},
            yaxis={'title': 'Boxer age range'},
            hovermode='closest',
            paper_bgcolor='black',
        )
    }

I have also tried using tickvals to specify the order in which things should appear in my plots but this didn't change the order of my xaxis

'layout': go.Layout(
    title='Wins rate by boxer age range',
    xaxis={'title':'Opposition age range','tickvals': order},
    yaxis={'title': 'Boxer age range'},
    hovermode='closest',
    paper_bgcolor='black',
)

Upvotes: 0

Views: 4259

Answers (1)

Emm
Emm

Reputation: 2507

Resolved this issue by referring to the plotly figure reference.

According to the documentation categoryarray can be used to set the order in which categories in an axis appear.

This is what I wrote:

order = ['15-20', '20-25', '25-30', '30-35', '35-40']
    return {
        'data': [
            go.Heatmap(
                z=fights['win_rate'],
                y=fights['age_range'],
                x=fights['opp_age_range'],
                showscale=True)
        ],
        'layout': go.Layout(
            title='Wins rate by boxer age range',
            xaxis={'title':'Opposition age range','categoryarray': order},
            yaxis={'title': 'Boxer age range'},
            hovermode='closest',
            paper_bgcolor='black',
        )

Upvotes: 3

Related Questions