How to do thIs diagram with force-directed graph in D3.js? -


i made diagram viz.js.

enter image description here

the dot code simple:

<script type="text/vnd.graphviz" id="mydiagram"> digraph g { graph [      fontname = "arial",     fontsize = 18,     label = "digest email flow chart",     size = "4,4" ];  node [       shape = ellipse,     sides = 4,     distortion = "0.0",     orientation = "0.0",     skew = "0.0",     bgcolor = lightgray,     style = filled,     fontname = "arial" ];  "email notification"   [shape=ellipse, shape = "mrecord" label="digest email\n(scheduled)"]; "sentiment analysis"   [shape=ellipse, shape = "mrecord" label="sentiment analysis\n(triggered)"]; "google news"          [shape=ellipse, shape = "mrecord" label="google news\n(scheduled)"]; "dilbert daily comics" [shape=ellipse, shape = "mrecord" label="dilbert daily comics\n(scheduled)"]; "time series chart"    [shape=ellipse, shape = "mrecord" label="time series chart\n(triggered)"]; "twitter stream"       [shape=ellipse, shape = "mrecord" label="twitter stream\n(scheduled)"];  "email notification" -> "time series chart" [dir = "back"]; "email notification" -> "dilbert daily comics" [dir = "back"]; "time series chart"  -> "twitter stream" [dir = "back"]; "sentiment analysis" -> "google news" [dir = "back"]; "email notification" -> "sentiment analysis" [dir = "back"]; } </script> 

but viz.js library 2.3 mb! large.

is possible same force-directed graph in d3.js?

eventually decided write charting code myself, because jsplumb conflicted in areas jquery mobile js , css. not hard own drawing on html5 canvas , end 'lighter' app.

this result:

link chart


Comments

Popular posts from this blog

c++ - Creating new partition disk winapi -

Android Prevent Bluetooth Pairing Dialog -

VBA function to include CDATA -