How to set fix y-axis values in a specific order?

[citoki]

I want to control the y-axis values in a certain order. I tried several things in layout but none of them seems to work. The order seems to be a bit random and therefore I get different results in the chart for pretty much the same data:

yaml config

type: custom:plotly-graph
title: Temps
hours_to_show: 12
refresh_interval: 120
autorange_after_scroll: true
entities:
  - entity: sensor.state_in_circuit_0
    showlegend: false
    yaxis: y2
    filters:
      - fn: |-
          ({ xs, ys, vars }) => {
            for (let i = 0; i < ys.length; i++) {
              if (ys[i] === "HEATING") {
                ys[i] = "On";
              } else if (ys[i] === "COOLING") {
                ys[i] = "Cooling";
              } else {
                ys[i] = "Idle";
              }
            }
          };
    line:
      width: 1
      dash: line
      color: rgba(255, 140, 0, 0.8)
    fill: tozeroy
    fillcolor: rgba(255, 140, 0, 0.1)
  - entity: sensor.heating_state_in_zone_1
    showlegend: false
    yaxis: y2
    filters:
      - fn: |-
          ({ xs, ys, vars }) => {
            for (let i = 0; i < ys.length; i++) {
              if (ys[i] === "Heating Up") {
                ys[i] = "Heat Up";
              } else if (ys[i] === "Cooling Down") {
                ys[i] = "Cooling";
              } else {
                ys[i] = "Idle";
              }
            }
          };
    line:
      width: 1
      dash: line
      color: rgba(255, 0, 0, 0.8)
    fill: tozeroy
    fillcolor: rgba(255, 0, 0, 0.2)
layout:
  dragmode: pan
  annotations:
    - xref: paper
      yref: paper
      'y': 0.35
      text: Heizkreis 1
      showarrow: false
    - xref: paper
      yref: paper
      'y': 0.1
      text: Zone 1
      showarrow: false
  yaxis:
    autorange: true
  yaxis2:
    fixedrange: true
    overlaying: true
    range:
      - Cooling
      - Idle
      - 'On'
      - Heat Up
    tickmode: array
    tickvals:
      - Cooling
      - Idle
      - 'On'
      - Heat Up

[dbuezas]

Since the values are categorical (not numbers), plotly positions them in the order it finds them. To fix the order you need to list them inside layout/xaxis.
See this answer https://stackoverflow.com/a/45479905