Line color based on condition

[Chavife]

I have a "pool temperature" graph alongside with heater on/off.
I would like to combine this into the "pool temperature" line such that the line is blue when the heater is off and red when the heater is on. So in other terms the "pool temperature" line would have 2 colors based on the heater condition.

Is there a way to achieve such thing?

type: custom:plotly-graph
entities:
  - entity: sensor.pool_temperature_temperature
    name: Pool temperature
    line:
      width: 2
      shape: spline
      smoothing: 10
    period:
      0s: 5minute
      1d: hour
      1M: day
      3M: week
  - entity: switch.heater
hours_to_show: 24
refresh_interval: 10
logarithmic_scale: false

[Chavife]

I think I figured it out

type: custom:plotly-graph
entities:
  - entity: switch.heater
    internal: true
    filters:
      - resample: 5m
      - store_var: heaterState
  - entity: sensor.pool_temperature_temperature
    legendgroup: 1
    showlegend: false
    name: Pool Temp
    filters:
      - resample: 5m
      - map_y_numbers: parseFloat(y)
      - map_y: >
          vars.heaterState.ys[i] === "off" || vars.heaterState.ys[i-1] ===
          "off" 
            ? y 
            : null
    line:
      color: cornflowerblue
      width: 2
      shape: spline
      smoothing: 10
  - entity: sensor.pool_temperature_temperature
    legendgroup: 1
    name: Pool Temp
    filters:
      - resample: 5m
      - map_y_numbers: parseFloat(y)
      - map_y: |
          vars.heaterState.ys[i] === "on" || vars.heaterState.ys[i-1] === "on" 
            ? y 
            : null
    line:
      color: firebrick
      width: 2
      shape: spline
      smoothing: 10
hours_to_show: 24
refresh_interval: 10
logarithmic_scale: false

the only issue is that the period functionality is not working now and I have no idea why.