Vega visualization

[Alice_Ionescu]

Hello,

I am trying to display records from a document in a table, horizontally, by using vega.

I have this: retrieves data from index pattern users-*, and displays the userName and the manager

{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "data": [
    {
      "name": "myData",
      "url": {
        "index": "users-*",
        "body": {
          "size": 1000,
          "_source": ["userName", "manager"],
          "query": {
            "match_all": {}
          }
        }
      },
      "format": {
        "property": "hits.hits"
      }
    }
  ],
  "mark": "table",
  "encoding": {
    "columns": [
      {"field": "_source.userName.keyword", "title": "User name"},
      {"field": "_source.manager.keyword", "title": "Manager"}
    ]
  }
}

But nothing is displayed. I don't know why. I have records in the index pattern.

Thanks!

[Marco_Liberati]

Hi @Alice_Ionescu

is there a specific reason to use Vega for the table? I'm asking as rendering a table in Vega requires a lot of manual tweaks as there's no primitive table mark, rather it needs to use the text mark with lots of manual positioning.

Here's an example of your spec with a table rendering:

{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "width": 400,
  "height": 5000,
  "data": [
    {
      "name": "myData",
      "url": {
        "index": "users-*",
        "body": {
          "size": 1000,
          "_source": ["userName", "manager"],
          "query": {
            "match_all": {}
          }
        }
      },
      "format": {
        "property": "hits.hits"
      },
/**
 * Need to manipulate a little bit the data to shape it into two columns with the right title
 * and add row numbers to position them vertically
 */
"transform": [
      {
     "type": "window",
     "ops": ["row_number"],
     "fields": [null],
     "as": ["row_num"]
    },{"type": "formula", "as": "User name", "expr": "datum._source.userName"},
    {"type": "formula", "as": "Manager", "expr": "datum._source.manager"},
    {"type": "fold", "fields": ["User name", "Manager"]}
      ]
    }
  ],
/**
 * Define how to compute X and Y for each text label
 */
"scales": [
   {
      "name": "yscale",
      "type": "band",
      "domain": {"data": "myData", "field": "row_num"},
       "range": "height"
    }, 
 {
      "name": "xscale",
      "type": "band",
      "domain": {"data": "myData", "field": "key"},
       "range": "width", 
       "padding": 15
    },

],

    "axes": [
    { 
      "orient": "top", 
      "scale": "xscale",
      "title": null,
      "domain": false,
      "ticks": false
    
    },
  ],
"marks": [
{
       "type": "text",
       "from": {"data": "myData"},
       "encode": {
         "enter":{

          "y": {"scale": "yscale", "field": "row_num"},
          "y2": {"scale": "yscale", "value": 0},
          "text": {"field": "value", "type": "nominal"},           

           "x": {"scale": "xscale", "field": "key"},
          "width": {"scale": "xscale", "band": 1}
          }
        }
     }

]