Skip to content

[RFE] Graph visualisation #43

@saaj

Description

@saaj

As a user of Sqliteviz,
In order to study structure and/or dynamics of complex networks (e.g. biological or infrastructure),
I want to be able to visualise a graph (a set of vertices and edges).

Candidate JavaScript graph libraries:

  1. sigma.js
  2. cytoscape.js

For both the data model looks roughly like (sans styling, layout, etc):

{
  "nodes": [
    {"id": "n0", "label": "A node"},
    {"id": "n1", "label": "Another node"},
    {"id": "n2", "label": "And a last one"}
  ],
  "edges": [
    {"id": "e0", "source": "n0", "target": "n1"},
    {"id": "e1", "source": "n1", "target": "n2"},
    {"id": "e2", "source": "n2", "target": "n0"}
  ]
}

This can be mapped to SQLite resultset structure like this.

CREATE TABLE "node" (
	"node_id"	INTEGER NOT NULL,
	"label"	    TEXT,
	PRIMARY KEY("node_id" AUTOINCREMENT)
);
CREATE TABLE "edge" (
	"edge_id"	INTEGER NOT NULL,
	"source_id"	INTEGER NOT NULL,
	"target_id"	INTEGER NOT NULL,
	PRIMARY KEY("edge_id" AUTOINCREMENT),
	FOREIGN KEY("source_id") REFERENCES "node"("node_id"),
	FOREIGN KEY("target_id") REFERENCES "node"("node_id")
);

INSERT INTO "node" VALUES (1,'A node');
INSERT INTO "node" VALUES (2,'Another node');
INSERT INTO "node" VALUES (3,'And a last one');
INSERT INTO "edge" VALUES (1,1,2);
INSERT INTO "edge" VALUES (2,2,3);
INSERT INTO "edge" VALUES (3,3,1);                  
SELECT 'e' "type", edge_id, source_id, target_id, json_object('foo', 1) "properties"
FROM edge
UNION
SELECT 'n' "type", node_id, NULL, NULL, json_object('label', label) "properties"
FROM node

json_object required JSON1 extension, which should be included by default in recent official builds of sql.js, sql-js/sql.js#440.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions