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.

Interpreting edge label position

See original GitHub issue

Hi,

Please consider the following Klay JSON:

{
    "id": "root",
    "labels": [
        {
            "text": "root"
        }
    ],
    "edges": [
        {
            "id": "off_on",
            "source": "off",
            "target": "on",
            "labels": [
                {
                    "text": "touch",
                    "width": 10.140625,
                    "height": 5
                }
            ]
        },
        {
            "id": "on_off",
            "source": "on",
            "target": "off",
            "labels": [
                {
                    "text": "touch",
                    "width": 10.140625,
                    "height": 5
                }
            ]
        }
    ],
    "width": 10,
    "height": 10,
    "children": [
        {
            "id": "off",
            "labels": [
                {
                    "text": "off"
                }
            ],
            "edges": [],
            "width": 10,
            "height": 10
        },
        {
            "id": "on",
            "labels": [
                {
                    "text": "on"
                }
            ],
            "edges": [],
            "width": 10,
            "height": 10
        }
    ]
}

When layout is applied, this yields the following kgraph:

{
    "id": "root",
    "labels": [
        {
            "text": "root"
        }
    ],
    "edges": [
        {
            "id": "off_on",
            "source": "off",
            "target": "on",
            "labels": [
                {
                    "text": "touch",
                    "width": 10.140625,
                    "height": 5,
                    "x": 37.99999952316284,
                    "y": 0
                }
            ],
            "sourcePoint": {
                "x": 88.14062404632568,
                "y": 24
            },
            "targetPoint": {
                "x": 22,
                "y": 24
            },
            "junctionPoints": []
        },
        {
            "id": "on_off",
            "source": "on",
            "target": "off",
            "labels": [
                {
                    "text": "touch",
                    "width": 10.140625,
                    "height": 5,
                    "x": 37.99999952316284,
                    "y": 16
                }
            ],
            "sourcePoint": {
                "x": 22,
                "y": 27.333333333333332
            },
            "targetPoint": {
                "x": 88.14062404632568,
                "y": 27.333333333333336
            },
            "bendPoints": [
                {
                    "x": 35.99999976158142,
                    "y": 27.333333333333332
                },
                {
                    "x": 35.99999976158142,
                    "y": 40
                },
                {
                    "x": 74.14062428474426,
                    "y": 40
                },
                {
                    "x": 74.14062428474426,
                    "y": 27.333333333333336
                }
            ],
            "junctionPoints": []
        }
    ],
    "width": 110.14062404632568,
    "height": 53,
    "children": [
        {
            "id": "off",
            "labels": [
                {
                    "text": "off"
                }
            ],
            "edges": [],
            "width": 10,
            "height": 10,
            "x": 88.14062404632568,
            "y": 20.666666666666668,
            "$H": 26
        },
        {
            "id": "on",
            "labels": [
                {
                    "text": "on"
                }
            ],
            "edges": [],
            "width": 10,
            "height": 10,
            "x": 12,
            "y": 20.666666666666664,
            "$H": 27
        }
    ],
    "$H": 1
}

I was wondering if you could guide me as to how to interpret the x and y values of the edge labels.

When both edge labels are interpreted as being in the coordinate space (sharing the offset of) node “on”, then this renders beautifully:

However it is unclear to me how to characterize the general relationship between these edge coordinates and node “on”. For example, edge “on_off” has a relationship with “on” such that “on” is the source of “on_off”. But this is not true of edge “off_on” - in this case node “on” is the target.

I would appreciate any guidance you can offer on how to interpret these coordinates. Thank you.