Vega-Lite problem with the visualization

Hi im trying to create something similar to image below.

The data, that i want to visualise is
syslog_hostname
syslog_ip_address
syslog_url
syslog_url_status

For one destination im checking 3 website, and i want to get all url status

Firt i set the static data

{
  "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
  "data": {
    
  "autosize": {
    "type": "fit",
    "contains": "padding",
    resize: true
  },
    "values": [
      {
        "syslog_ip_address": "10.1.0.",
        "syslog_url": "https://google.com",
        "syslog_hostname": "DESTINATION1",
        "syslog_status": 200
 }
    ]
  },
  "transform": [
    {
      "calculate": "if(datum.syslog_status === 200, 'Success', (datum.syslog_status >= 500 ? 'Error' : 'Warning'))",
      "as": "status_category"
    },
    {
      "aggregate": [{"op": "count", "as": "count"}],
      "groupby": ["syslog_hostname", "syslog_url", "status_category"]
    }
  ],
  
  "mark": "rect",
  "width": 60,
        "height": 20,
  "encoding": {
    "row": {"field": "syslog_hostname", "type": "nominal"},
    "column": {"field": "syslog_url", "type": "nominal"},
    "color": {
      "field": "status_category",
      "type": "nominal",
      "scale": {
        "domain": ["Success", "Error", "Warning"],
        "range": ["green", "red", "orange"]
      },
      "legend": {"title": "Status strony"}
    },
    "tooltip": [
      {"field": "syslog_hostname", "type": "nominal", "title": "DESTINATION"},
      {"field": "syslog_url", "type": "nominal", "title": "URL"},
      {"field": "status_category", "type": "nominal", "title": "STATUS"},
      {"field": "count", "type": "quantitative", "title": "COUNT"}
    ]
  }
}

it was working but when i tryied to set the dynamic data i got an error

  "data": {
    "url": {
      "%context%": true,
      "%timefield%": "@timestamp",
      "index": "logs-filebeat.d*",
      "body": {
        "size": 10000,
        "_source": ["@timestamp", "syslog_ip_address", "syslog_url", "syslog_status"]
      }
    },
    "format": {"property": "hits.hits"}
  },

I would be greatfull for help to modify this code to create the visualization similar to treemap that will display for each location status of all websites

Hello, did you solve your issue?
What's the error message you got?

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.