Published
Edited
Sep 14, 2018
1 fork
3 stars
// http://soc.if.usp.br/manual/graphviz/html/info/attrs.html
chart = dot`digraph {
graph [nodesep=.1, ranksep=1.5];
rankdir=LR;
splines=true;
concentrate=false;
node [fontname="Verdana"]
node [fillcolor="#b3e0ff", style=filled, shape=rectangle; fixedsize=true; width=1.2; height=.6];
Token, Eng, Prod, Marketing, Ops, Legal, Investors, Community, Finance;
node [fillcolor="#b3e6cc", style=filled, shape=rectangle; fixedsize=true; width=1.2; height=.7];
Airdrop, Partners, Sandbox, Token, Blog, Website, Social, Exchange, Platform, OpenSource, Mechanism, DevRel;
node [fillcolor="#b3e6cc", style=filled, shape=rectangle; fixedsize=true; width=1.2; height=.7];
Identity, Compute, Registry, Settlements, Console;
node [fillcolor="#fff7e6", style=filled, fontsize=12, shape=circle, fixedsize=true, width=.8, height=.7];
MyStartupCFO, OSS, Contractors, Bert, Ramesh, Adam, Mike;
node [fillcolor="#F0F0F0", style=filled, fontsize=12, shape=circle, fixedsize=true, width=.8, height=.7];
edge [fontname="Verdana", fontsize=10, arrowsize=0.75, arrowhead=vee, penwidth=0.5, color=black ];
MyStartupCFO [fontsize=10, label="My\nStartup\nCFO"];
Social [label="Social\nMedia"];
Mechanism [label="Token\nMechanism"];
OpenSource [label="Open\nSource"];
Console [fontsize=11, label="Tools\nCLI/Console"];
Settlements [label="Settlements\n/Contracts"];
Identity [fontsize=20 label="Identity\n/Accounts"];
Identity [fontsize=12];
Compute [fontsize=12];
Settlements [fontsize=12];
Registry [fontsize=12, label="Decentralized\nRegistry"];
OSS [fontsize=10, label="OSS\nProjects"];
Contractors [fontsize=9];
{ rank=same Rich Paul Lucas Molly }
{ rank=same Legal Prod Eng Ops Marketing Token Community Investors }
{ rank=same Airdrop Partners Sandbox Mechanism }
{ rank=same Compute MyStartupCFO OSS }
{ rank=same
Andrew Ankur
Salar Matt Leland Tim Alex Tom
David Ashwin Nathan Thomas Pete Max Egor
Jass Nereo
}
//
// Molly
//
Molly -> Ops:w;
Ops:e -> MyStartupCFO:w;
//
// Rich
//
Rich -> Eng:w;
Rich -> Prod:w;
Rich -> Finance:w;
Rich -> Legal:w;
subgraph cluster_Legal {
graph[style=invis];
Adam; Bert; Ramesh; Mike;
}
Legal:e -> Adam [labeldistance=3, headlabel="Corp"];
Legal:e -> Bert [labeldistance=3, headlabel="Tax/Compliance"];
Legal:e -> Ramesh [labeldistance=3, headlabel="Cayman"];
Legal:e -> Mike [labeldistance=3, headlabel="IP/Litigation"];
Prod:e -> Sandbox:w;
Prod:e -> OpenSource:w;
subgraph cluster_Eng {
graph[style=invis];
Platform; OpenSource; Console;
}
Eng:e -> Platform:w;
Eng:e -> OpenSource:w;
Eng:e -> Console:w;
subgraph cluster_Platform {
graph[style=invis];
Identity; Compute; Settlements; Registry;
}
Platform:e -> Identity:w;
Platform:e -> Compute:w;
Platform:e -> Settlements:w;
Platform:e -> Registry:w;
Registry:e -> Pete [penwidth=1.5];
Registry:e -> David;
Registry:e -> Andrew;
Registry:e -> Egor;
Settlements:e -> Ashwin [penwidth=1.5];
Settlements:e -> Salar;
Settlements:e -> Egor;
subgraph cluster_Compute {
graph[style=dotted];
Ashwin; Nathan; Thomas;
}
Compute:e -> Ashwin [penwidth=1.5];
Compute:e -> Nathan;
Compute:e -> Thomas;
Identity:e -> Pete [penwidth=1.5];
Identity:e -> Egor;
//OpenSource:e -> David:w [penwidth=1.5];
Sandbox:e -> Max;
//
// Lucas
//
Lucas -> Rich [style=invis];
Lucas -> Token:w;
Lucas -> Investors:w;
Lucas -> Community:w;
Lucas -> Finance:w;
Lucas -> Legal:w;
Finance:e -> Bert;
//Investors:e -> Leland;
Community:e -> Airdrop:w;
Community:e -> Partners:w;
subgraph cluster_Community {
graph[style=invis];
Airdrop; Partners;
}
Community:e -> Tom;
Token:e -> Mechanism:w;
Token:e -> Exchange:w;
Mechanism:e -> Bert;
Mechanism:e -> Ankur;
Mechanism:e -> Tim;
Mechanism:e -> Alex;
Mechanism:e -> Andrew;
Mechanism:e -> Matt;
Mechanism:e -> Salar;
//
// Paul
//
Paul -> Marketing:w;
Marketing:e -> Blog:w;
Marketing:e -> Social:w;
Marketing:e -> DevRel:w;
Marketing:e -> Website:w;
subgraph cluster_Marketing {
graph[style=invis];
Blog; Social; DevRel; Website;
}
Blog:e -> Pete [style=dashed, color="#000099"];
Blog:e -> Salar [style=dashed, color="#000099"];
Blog:e -> Leland [style=dashed, color="#000099"];
Blog:e -> Matt [style=dashed, color="#000099"];
Blog:e -> Andrew [style=dashed, color="#000099"];
Social:e -> Jass;
Website:e -> Nereo;
DevRel:e -> Contractors:w;
DevRel:e -> OSS:w;
}`
import {rasterize, serialize} from "@mbostock/saving-svg"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
