Simple on/off graph?

[nalcabio-tom]

I have some embedded devices that send data to elasticsearch when they're turned on (1) and off (0). I'd like to visualize this in some way that clearly shows the duration of time when they're on. What I have below works for showing dots at the times when they're turned on and off. If I switch to an area chart I almost get what I want, except the connections from 1 to 0 are downward sloping lines. I'd like these lines to remain horizontal from 1 and then drop straight down to 0 at 0. Hope this makes sense. Anyone have any ideas on how to achieve this? Thanks!

{
  $schema: https://vega.github.io/schema/vega-lite/v2.json
  data: {
    url: {
      %context%: true
      %timefield%: ctx#timestamp
      index: nalca1.00
      body: {
        size: 10000
        _source: [
          ctx#timestamp
          data#device-state
          data#device#device-name
        ]
      }
    }
    format: {
      property: hits.hits
    }
  }
  transform: [
    {
      calculate: toDate(datum._source['ctx#timestamp'])
      as: timestamp
    }
  ]
  mark: circle
  encoding: {
    x: {
      field: timestamp
      type: temporal
    }
    y: {
      field: _source.data#device-state
      type: quantitative
      axis: {
        title: Device state
      }
    }
    color: {
      field: _source.data#device#device-name
      type: nominal
      legend: {
        title: Device name
      }
    }
  }
}

[hydrosquall]

Hi @nalcabio-tom ,

Editor with minimal example

I think you're looking to set a custom interpolate setting, it works with both line and area marks. Will this work for you?

As a side note, the spec you pasted references Vega-Lite 2, which is no longer maintained. You may want to double check what version of Vega is used on your Kibana instance, as the latest version seems to be using Vega-Lite 5.

[nalcabio-tom]

the spec you pasted references Vega-Lite 2

Good to know. Thanks. Just updated to Kibana 9 which shows $schema: https://vega.github.io/schema/vega-lite/v5.json

[nalcabio-tom]

Will this work for you?

From your example, that looks like what I want. Thanks!