Simple websocket attempt, links not being rendered #241

jkrauska · 2019-02-03T04:48:40Z

I've been trying to use vivagraph to represent a tree (ideally later with dynamic updates to nodes on the tree)

The nodes get placed as I'd like, but the links don't render.

Does placing nodes change the behavior of links?

Please advise?

HTML/JS:

<!DOCTYPE html>
<html>
    <head>
        <title>VivaTree</title>
        <script src="vivagraph.js"></script>
        <script type='text/javascript'>
        function onLoad() {
            var graph = Viva.Graph.graph();
            var layout = Viva.Graph.Layout.constant(graph)

            var renderer = Viva.Graph.View.renderer(graph, {
                    layout : layout
                });
            renderer.run();

            var ws = new WebSocket('ws://localhost:8080/');

            ws.onmessage = function(event) {
                console.log('Received Data: ' + event.data);
                var message = JSON.parse(event.data);

                if ('command' in message) {
                    //FIXME: Supoprt batch 'commands'
                    graph.beginUpdate()
                    switch(message['command']) {
                        case 'addNode':
                            console.log('running addnode')
                            graph.addNode(message['id'], message['data'])
                            layout.placeNode(function(node) {
                                return {x: message['x'],
                                        y: message['y']};
                            });

                            break;
                        case 'addLink':
                            console.log('running addLink' + message['from'])
                            graph.addLink(message['from'], message['to'])
                            break;
                        default:
                            console.log('Unsupported command.')
                    }
                    graph.endUpdate()
                }
            };

        }
</script>
<style type="text/css" media="screen">
    body, html, svg { width: 100%; height: 100%; overflow: hidden; }
</style>
</head>
<body onload="onLoad()">
</body>
</html>

Simple Python wrapped with websocketd

#!/usr/bin/env python3
from sys import stdout
import json
import math

x_spacer = 30
y_spacer = 40

# Row in tree. (top is 0)
def get_row(id):
  if id == 0:
    return 0
  else:
    return math.floor(math.log2(id+1))

def get_y_pos(id):
  return y_spacer * get_row(id)

def get_x_pos(id):
  if id == 0:
    return 0
  row = get_row(id)
  shift = 2 ** row + 2 ** (row-1) - 1.5
  adjust = id - shift
  return x_spacer * adjust

# Count from 1 to 10 with a sleep
for count in range(0, 2 ** 4 -1 ):
  output = {
    'command' : 'addNode',
    'id': count,
    'x' : get_x_pos(count),
    'y':  get_y_pos(count),
  }
  print(json.dumps(output, sort_keys=True))
  stdout.flush()

  uplink = int(math.floor((count-1)/2))
  if uplink >= 0:
    output = {
      'command' : 'addLink',
      'from': count,
      'to': uplink,
    }
    print(json.dumps(output, sort_keys=True))
    stdout.flush()

Data being sent over socket

{"command": "addNode", "id": 0, "x": 0, "y": 0}
{"command": "addNode", "id": 1, "x": -15.0, "y": 40}
{"command": "addLink", "from": 1, "to": 0}
{"command": "addNode", "id": 2, "x": 15.0, "y": 40}
{"command": "addLink", "from": 2, "to": 0}
{"command": "addNode", "id": 3, "x": -45.0, "y": 80}
{"command": "addLink", "from": 3, "to": 1}
{"command": "addNode", "id": 4, "x": -15.0, "y": 80}
{"command": "addLink", "from": 4, "to": 1}
{"command": "addNode", "id": 5, "x": 15.0, "y": 80}
{"command": "addLink", "from": 5, "to": 2}
{"command": "addNode", "id": 6, "x": 45.0, "y": 80}
{"command": "addLink", "from": 6, "to": 2}
{"command": "addNode", "id": 7, "x": -105.0, "y": 120}
{"command": "addLink", "from": 7, "to": 3}

The text was updated successfully, but these errors were encountered:

jkrauska · 2019-02-03T04:49:45Z

image

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Simple websocket attempt, links not being rendered #241

Simple websocket attempt, links not being rendered #241

jkrauska commented Feb 3, 2019

jkrauska commented Feb 3, 2019

Simple websocket attempt, links not being rendered #241

Simple websocket attempt, links not being rendered #241

Comments

jkrauska commented Feb 3, 2019

jkrauska commented Feb 3, 2019