Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue in vega tree layout

See original GitHub issue

I am using vega in kibana. I try to plot tree layout graph in kibana, its cannot visualize anything but i try same json in vega online editor its works fine. I spotted this issue as repeated ID value, but I am not sure about it . I attach my json below

{
  "$schema": "https://vega.github.io/schema/vega/v3.json",
 "width": 600,
  "height": 1600,
  "padding": 5,

  "signals": [
    {
      "name": "labels", "value": true,
      "bind": {"input": "checkbox"}
    },
    {
      "name": "layout", "value": "tidy",
      "bind": {"input": "radio", "options": ["tidy", "cluster"]}
    },
    {
      "name": "links", "value": "diagonal",
      "bind": {
        "input": "select",
        "options": ["line", "curve", "diagonal", "orthogonal"]
      }
    }
  ],

  "data": [
    {
      "name": "tree",
      "values":[ {
    "id": 1,
    "name": "tango"
 },
 
 {
    "id": 2,
    "name": "che",
	"parent": 1
  },
 {
    "id": 3,
    "name": "hyd",
	"parent": 1
  },
  
  {
    "id": 4,
    "name": "che-R1",
	"parent": 2
  },
  
  {
    "id": 4,
    "name": "che-R1",
	"parent": 1
  }
],
      "transform": [
        {
          "type": "stratify",
          "key": "id",
          "parentKey": "parent"
        },
        {
          "type": "tree",
          "method": {"signal": "layout"},
          "size": [{"signal": "height"}, {"signal": "width - 50"}],
          "as": ["y", "x", "depth", "children"]
        }
      ]
    },
    {
      "name": "links",
      "source": "tree",
      "transform": [
        { "type": "treelinks" },
        {
          "type": "linkpath",
          "orient": "horizontal",
          "shape": {"signal": "links"}
        }
      ]
    }
  ],

  "scales": [
    {
      "name": "color",
      "type": "sequential",
      "range": {"scheme": "magma"},
      "domain": {"data": "tree", "field": "depth"},
      "zero": true
    }
  ],

  "marks": [
    {
      "type": "path",
      "from": {"data": "links"},
      "encode": {
        "update": {
          "path": {"field": "path"},
          "stroke": {"value": "#ccc"}
        }
      }
    },
    {
      "type": "symbol",
      "from": {"data": "tree"},
      "encode": {
        "enter": {
          "size": {"value": 100},
          "stroke": {"value": "#fff"}
        },
        "update": {
          "x": {"field": "x"},
          "y": {"field": "y"},
          "fill": {"scale": "color", "field": "depth"}
        }
      }
    },
    {
      "type": "text",
      "from": {"data": "tree"},
      "encode": {
        "enter": {
          "text": {"field": "name"},
          "fontSize": {"value": 9},
          "baseline": {"value": "middle"}
        },
        "update": {
          "x": {"field": "x"},
          "y": {"field": "y"},
          "dx": {"signal": "datum.children ? -7 : 7"},
          "align": {"signal": "datum.children ? 'right' : 'left'"},
          "opacity": {"signal": "labels ? 1 : 0"}
        }
      }
    }
  ]
}

@nyurik

Issue Analytics

State:
Created 5 years ago
Comments:5 (4 by maintainers)

Top GitHub Comments

1reaction

mattijncommented, Jul 27, 2018

I’m afraid I can’t help you as I don’t know Kibana. Maybe there has been a recent development on the Vega side which is not yet included in Kibana?

0reactions

domoritzcommented, Aug 15, 2018

Yes, that would be great but it’s not the most pressing issue for the editor.

Top Results From Across the Web

Tree Layout Example - Vega & Vega-Lite

Tree Layout Example. A node-link tree diagram of classes in a software package hierarchy, positioned in Cartesian coordinates using Vega's tree transform.

Vega tree layout error - Kibana - Discuss the Elastic Stack

I am new to vega! I want to create a tree layout from dynamically created documents. chat is the name of my Index...

Vega Radial-Tree-Layout with Legend - Popular Blocks

This is a variation of the Vega Radial-Tree-Layout Example, where I have introduced a "legends" element to the spec.

Working with elasticsearch JSON format for tree

Hi, I'm trying to make a tree diagram but I'm having some trouble with getting my data in a way that things ......

VegaChart Examples | Charts - Google Developers

Examples of VegaChart with Vega. Heatmap Example. VegaChart can draw a Heatmap using simple rect marks for each cell. (Original ...