__________________________________________________________________________________________
                  _/  _/                                                                _/   
     _/_/_/  _/        _/_/_/                _/_/_/  _/  _/_/    _/_/_/  _/_/_/    _/_/_/    
  _/    _/  _/  _/  _/    _/  _/_/_/_/_/  _/    _/  _/_/      _/    _/  _/    _/  _/    _/   
 _/    _/  _/  _/  _/    _/              _/    _/  _/        _/    _/  _/    _/  _/    _/    
  _/_/_/  _/  _/    _/_/_/                _/_/_/  _/          _/_/_/  _/_/_/    _/    _/     
     _/                                      _/                      _/                      
_/_/                                    _/_/                        _/                       
__________________________________________________________________________________________
a->P P->h i->A G->L L->i g->R R->a a a P P i i A A G G L L g g R R h h

glia graph


< DRAFT++ >
< AUX > → XXX🔗gliagraph

Realtime Text-to-graph system with 🔗E2H.

Revisions:
    2017-04-11
    2017-09-27 touch
    2017-10-10 touch + restyle
    2022-02-04 MO finally 0330→
    2022-02-13 reread
[!*] For living docs (new feature tests), see:
    TOTALISM-OLD🔗dev-graph-test-dev

 

*** USING


What is it?

Glia Graph renders graphs ("directed networks").

It's a glorified wrapper, with an own (very simplified) syntax for GraphViz, a set of SVG—CSS integrations, and many extra features.



Useful for representing...
:
    * site indexes
    * processes ("flows")
    * argument mapping, see XXX🔗polemics
    * nature-system diagrams
    * psycho-social networks & dynamics
    * protocols & game descriptions
    * people-tag networks
    * ### WE NEED POST-PROSAIC ("umetniško pero"), TACTICAL EXPRESSION MECHANISMS
    * essays, posts, etc are not necessary consequential (contingent outcomes)
    * website intertwingularity analysis
        * show which parts of website have "passages" to other parts"
        * can expose weird/private links (especially if scraped dump)
    * other 🔗representation-systems
    * social media relation graphs (with plugins)
    * graphs of relations by word2vec, TF-IDF, making wordclouds (with plugins)
    * [...]



Demos / examples
:
    * TOTALISM-OLD🔗dev-graph-test-dev (testing features) !
    * 🔗graph-index totalism.org sitemap
    * 🔗graph-postapple
    * 🔗farming
    * 🔗why-how-what
    * 🔗graph-beer
    * 🔗trails
    * 🔗tfc17
    * [...]
    * ### [!!]

Deprecated / needs update:
    * TOTALISM-OLD🔗graph-neu
    * TOTALISM-OLD🔗dev-graph-test3:
        shows need for render control (for circular!)
    * [...]
[!!*] merge with above 




*** INPUT SYNTAX (on examples)


* describing graphs

    * A,B,C,D,E :
        all undirected and interconnected

    * A>B>C>D>E or A<B<C<D<E :
        directed graph

    * A<>B :
        co-position (bothways arrowheads)

    * X:A,B,C,D,E (or X,:...):
        all connected only to first one ("subset of X")

    * X>:A,B,C,D,E (or X<:... or X<>:...) :
        same as above, but directed!

    * X >[Y] Z :
        labeled connection


* referencing nodes

    * ~~X:
        approximate matching using substring matching or levenshtein distance as fallback

    * ^ :
        reference to FIRST item in previous line

    * $ :
        reference to LAST item in previous line


* node styles

    * !X (or !: ...):
        "strong" X (expose)

    * ~X (or ~: ...):
        "emphasis" X

    * _X (or _: ...):
        "underline" X

    * %X (or %: ...):
        "strikeout" X


{{1}}->none none->{{1}} none->{{2}} {{conn: italic & underline}}->italic & underline underline->{{conn: italic & underline}} underline->{{conn: exposed & underline}} underline->{{conn: underline & strikeout}} underline->{{conn: exposed & italic & underline}} underline->{{conn: italic & underlice & strikeout}} underline->{{conn: exposed & italic & underline & strikeout}} {{conn: exposed & underline}}->exposed & underline {{conn: underline & strikeout}}->underline & strikeout {{conn: exposed & italic & underline}}->exposed & italic & underline {{conn: italic & underlice & strikeout}}->italic & underlice & strikeout {{conn: exposed & italic & underline & strikeout}}->exposed & italic & underline & strikeout {{conn: italic & strikeout}}->italic & strikeout italic->{{conn: italic & underline}} italic->{{conn: exposed & italic & underline}} italic->{{conn: italic & underlice & strikeout}} italic->{{conn: exposed & italic & underline & strikeout}} italic->{{conn: italic & strikeout}} italic->{{conn: exposed & italic}} italic->{{conn: exposed & italic & strikeout}} {{conn: exposed & italic}}->exposed & italic {{conn: exposed & italic & strikeout}}->exposed & italic & strikeout exposed->{{conn: exposed & underline}} exposed->{{conn: exposed & italic & underline}} exposed->{{conn: exposed & italic & underline & strikeout}} exposed->{{conn: exposed & italic}} exposed->{{conn: exposed & italic & strikeout}} exposed->{{conn: exposed & strikeout}} {{conn: exposed & strikeout}}->exposed & strikeout {{2}}->none strikeout->{{conn: underline & strikeout}} strikeout->{{conn: italic & underlice & strikeout}} strikeout->{{conn: exposed & italic & underline & strikeout}} strikeout->{{conn: italic & strikeout}} strikeout->{{conn: exposed & italic & strikeout}} strikeout->{{conn: exposed & strikeout}} none none italic & underline italic & underline underline underline italic & strikeout italic & strikeout italic italic exposed & underline exposed & underline exposed exposed exposed & strikeout exposed & strikeout exposed & italic exposed & italic underline & strikeout u n d e r l i n e & s t r i k e o u t exposed & italic & strikeout exposed & italic & strikeout exposed & italic & underline & strikeout e x p o s e d & i t a l i c & u n d e r l i n e & s t r i k e o u t strikeout strikeout exposed & italic & underline exposed & italic & underline italic & underlice & strikeout i t a l i c & u n d e r l i c e & s t r i k e o u t




* crawling collections

    (for 🔗E2H pods)
    (plugins available for other collections, like MediaWiki, etc)

    * @@<depth>pad (or @@<depth>: ...):
        include the links from pad(s) as nodes!
        basically a crawler!
        <depth> is optional (default is 1)

    * @@@pad
        similar to @@, but depth is controlled by the CRAWLDEPTH directive (default is 3)



* special directives

    * "#!ENGINE=X":
        use another graphviz layout engine
        see → https://www.graphviz.org/doc/info/lang.html
        default:
            * "dot"
        others looking useful:
            * "circo": renders in circular way!
            ###[!] document
            * "fdp"
            * "neato"
            * "twopi"
            * "sfdp"
        others needing work [!]
            (need tweaking of graphviz settings!)
            * "patchwork"

    * "#!LON":
        link on nodes

    * "#!COLOR=X":
        * "random": node color is randomly generated, edge colours follow nodes (default)
        * "props": color is determined by node properties
        * "B&W": black and white
        * "<mode>+-": adding +- to color mode makes edge label [+] a green connection, [-] a red connection, and black otherwise
        degree, degreeIn, .. [!]

    * "#!TOOLTIP=false":
        no tooltip on nodes
    
    * #!SHAPE=X:
        http://www.graphviz.org/doc/info/shapes.html
        rect, oval, box3d, star, [...]

    * "#!OVERLAP=X":
        * "scale": scales graph until there are no overlaps (default)
        * "prism": ???
        * "orthoxy": ???
        * see: http://www.graphviz.org/doc/info/attrs.html#d:overlap

    * "#!EDGESTYLE<|.directed|.undirected|.bidirected>=Y" :
        first:
            * "": all edges
            * ".directed": directed edges
            * ".undirected": undirected edges
            * ### : both sided?
        * second, also see graphviz documentation:
            * invis (invisible)
            * solid (default)
            * dashed
            * dotted
            * bold <--- #TODO: I see no change - maybe if penwidth would be unset?
        ----------------------
        examples:
            #!EDGESTYLE=dashed
            #!EDGESTYLE.undirected=dashed
            #!EDGESTYLE.directed=invis




* requests settings

Request defaults:
    * input:
        E2H pad (sourceMethod=http/totalism, sourceFormat=text/graph/t-graph)
    * output:
        SVG (sinkFormat=graph/svg)
    * engine/renderer:
        "dot" (graphviz.ENGINE=dot)


    ————— by source


    * inside pads

See many examples around https://totalism.org


    * from pads

EXAMPLE FOR PADS via 🔗glia-graph-pad.

    * pad → .PNG:
        http://totalism.org:7777/glia2?input=glia-graph-pad&sinkFormat=graph/png

    * pad → .SVG:
        http://totalism.org:7777/glia2?input=glia-graph-pad

    * pad → graphviz raw (=text):
        == get Graphviz as output
        "&sinkFormat=text/graph/graphviz"
        http://totalism.org:7777/glia2?input=glia-graph-pad&sinkFormat=text/graph/graphviz


    * from raw graphviz

    * graphviz raw (=pad) --> graphviz rendered (=svg/png)
        ==send pad as input to Graphviz
        "&sourceFormat=text/graph/graphviz"
        -----------------------
        EXAMPLE #1
                in: http://pad.totalism.org/p/dev-graph-test-graphviz
                out: http://totalism.org:7777/glia2?input=dev-graph-test-graphviz&sourceFormat=text/graph/graphviz
        ________________
        EXAMPLE #2
                <----------- TODO: DOES NOT WORK >matic [!]
                based on output of: TOTALISM-OLD🔗glia-graph-pad (manual copy over)
                as: http://totalism.org:7777/glia2?input=glia-graph-pad&sinkFormat=text/graph/graphviz
                copied to pad: TOTALISM-OLD🔗glia-graph-pad-graphviz
                out: http://totalism.org:7777/glia2?input=glia-graph-test-graphviz&sourceFormat=text/graph/graphviz


    ————— other


    * request a graph of E2H interlinks
    (pad interconnections)
    http://totalism.org:7777/glia2?input=coop,coop-alike,coop-agreement,coop-zero&sourceFormat=text/e2h/links&graph.LON=true
    (comma separated list of pads as input)


    * pass graphviz directives
    (example: change graph engine)
    http://totalism.org:7777/glia2?input=dev-graph-test3&graphviz.ENGINE=circo
    http://pad.totalism.org/p/dev-graph-test3





* (tips & tricks)

    * entities are trimmed
    * lines are split at ~32 characters + current word
    * "hanging node" with no connections is displayed

    * pass different, but same-looking (same label) entity:
        use single uppercase letter after tag
        like "some label #A"

    * [...]




*** TODO / FEATURE REQUESTS


[!!] insert images as nodes

[!!] specify (and stylize) edge types

[!] document E2X-graph (e2x-g)

[!**] document SVG—CSS features


<-------------------------- (new) TODO ↑



*** CREDITS

Developed mostly 2016/2017 by Matic Potočnik, specified by David Potočnik.




Edit Site

Edit CSS