Read data from ElasticSearch data using vega

This is my vega code:

    {
      $schema: https://vega.github.io/schema/vega-lite/v2.json
      data: {
    url: {
      %context%: true
      %timefield%: "incident_date_time"
      index: incident*
      body: {
        size: 10000
        _source: ["incident_date_time"]
      }
    }
    # We only need the content of hits.hits array
    format: {property: "hits.hits"}
      }
      mark: bar
      encoding: {
    x: {field: "time", type: "temporal"}
      }
    }

I have index called incident* in the index pattern and I am trying to display number of incidents per day (count)

But I am getting empty chart.


I tired to build it using kibana vis. and it works.

This is the data form from dev tools when I run

GET incident*/_search
{
  "size": 3,
  "_source": ["incident_date_time"]
}
{
  "took" : 2,
  "timed_out" : false,
  "_shards" : {
    "total" : 1,
    "successful" : 1,
    "skipped" : 0,
    "failed" : 0
  },
  "hits" : {
    "total" : {
      "value" : 333,
      "relation" : "eq"
    },
    "max_score" : 1.0,
    "hits" : [
      {
        "_index" : "incident_data",
        "_type" : "_doc",
        "_id" : "2",
        "_score" : 1.0,
        "_source" : {
          "incident_date_time" : "2020-03-19T18:45:31.000Z"
        }
      },
      {
        "_index" : "incident_data",
        "_type" : "_doc",
        "_id" : "3",
        "_score" : 1.0,
        "_source" : {
          "incident_date_time" : "2020-03-19T18:45:51.000Z"
        }
      },
      {
        "_index" : "incident_data",
        "_type" : "_doc",
        "_id" : "4",
        "_score" : 1.0,
        "_source" : {
          "incident_date_time" : "2020-03-19T18:46:23.000Z"
        }
      }
    ]
  }
}

Any idea what's wrong

Give the data set a name. It's a required field. https://vega.github.io/vega/docs/data/

Then in your marks reference it. https://vega.github.io/vega/docs/marks/

    {
      $schema: https://vega.github.io/schema/vega-lite/v2.json
      data: {
    url: {
      name: table
      %context%: true
      %timefield%: "incident_date_time"
      index: incident*
      body: {
        size: 10000
        _source: ["incident_date_time"]
      }
    }
    # We only need the content of hits.hits array
    format: {property: "hits.hits"}
      }
      mark: bar
     from: {"data": "table"},
      encoding: {
    x: {field: "time", type: "temporal"}
      }
    }

You can see your data in your browsers dev tools console. On the console you can run VEGA_DEBUG.view.data('data') and it will show you what's in the data set. This is an easy way to troubleshoot if the data or marks is your issue.

1 Like

Just noticed you are using Vega-Lite vs Vega which is what I reference. I don't use Vega-Lite so I am not sure it works the same way.

Your vega-lite spec looks totally fine to me, except that you are encoding a field that doesn't exist: x: {field: "time", type: "temporal"} doesn't make sense, because the documents you have don't have a field called time. Since your documents contain an ISO 8601 timestamp, you may want to apply a transform section above the encodings:

transform: [{
  calculate: "toDate(datum._source.incident_date_time)",
  as: "time"
}]

encoding: {
1 Like

Thanks. I got you. Are you aware on how I may use the transform as domain for scale. \

     transform: [{calculate: "toDate(datum._source.incident_date_time)",as: "time"}],

     "scales": [
       {
         "name": "xscale",
         "type": "time",
         "range":"width",
         "round": true,
         "domain": {"data": "events", "field": "timefield"}
       }
     ],

I was using time timefield but as you described it is non informative. How may I use the transformation here?

It looks like you're trying to mix Vega and Vega-lite specs: try using the docs here https://vega.github.io/vega-lite/docs/scale.html#example-customizing-domain-for-a-time-scale

1 Like

Thank you. The issue was in mixing vega and vega-lite and not adding a name for the data. Also, transform-calculate in vega-lite is transform-formula in vega.