visualization-vega.json

{
  $schema: https://vega.github.io/schema/vega-lite/v5.json
  data: {
    url: {
      %context%: true
      %timefield%: @timestamp
      /* tells the visualization which index to use */
      index: opensearch_dashboards_sample_data_logs
      /* This sets up the buckets used for X and Y axis values */
      body: {
        /* Sets up 2 aggregation buckets... */
        aggs: {
          1: {
            /* ...one for the timestamps for the X axis... */
            date_histogram: {
              field: @timestamp
              fixed_interval: 3h
              time_zone: America/Los_Angeles
              min_doc_count: 1
            }
            /* ... and one for the bytes sent in that time frame */
            aggs: {
              2: {
                avg: {
                  field: bytes
                }
              }
            }
          }
        }
        size: 0
      }
    }
    format: {
      property: aggregations.1.buckets
    }
  }
  transform: [
    {
      /* you can transform your data here. In this case, we are just mapping to the timestanmps and the average bytes */
      calculate: datum.key
      as: timestamp
    }
    {
      calculate: datum[2].value
      as: bytes
    }
  ]
  layer: [
    {
      mark: {
        type: line
      }
    }
    {
      mark: {
        type: circle
        tooltip: true
      }
    }
  ]
  /* Now that we've set up the buckets and transformed (set) the data points, you'll tell the graph how to map each axis. */
  encoding: {
    x: {
      field: timestamp
      type: temporal
      axis: {
        title: @timestamp
      }
    }
    y: {
      field: bytes
      type: quantitative
      axis: {
        title: Average bytes
      }
    }
    color: {
      datum: Average bytes
      type: nominal
    }
  }
}