This module implements everything that can be used to draw graphs with d3.js in Sage.
On Python’s side, this is mainly done by wrapping a graph’s edges and vertices in a structure that can then be used in the javascript code. This javascript code is then inserted into a .html file to be opened by a browser.
What Sage feeds javascript with is a “graph” object with the following content:
vertices – each vertex is a dictionay defining :
- name – The vertex’s label
- group – the vertex’ color (integer)
The ID of a vertex is its index in the vertex list.
edges – each edge is a dictionary defining :
- source – the ID (int) of the edge’s source
- target – the ID (int) of the edge’s destination
- color – the edge’s color (integer)
- value – thickness of the edge
- strength – the edge’s strength in the automatic layout
- color – color (hexadecimal code)
- curve – distance from the barycenter of the two endpoints and the center of the edge. It defines the curve of the edge, which can be useful for multigraphs.
pos – a list whose th element is a dictionary defining the position of
the
th vertex.
It also contains the definition of some numerical/boolean variables whose definition can be found in the documentation of show() : directed, charge, link_distance, link_strength, gravity, vertex_size, edge_thickness.
Warning
Since the d3js package is not standard yet, the javascript is fetched from d3js.org website by the browser. If you want to avoid that (e.g. to protect your privacy or by lack of internet connection), you can install the d3js package for offline use with the Sage command install_package('d3js') or by running sage -i d3js from the command line.
Todo
Authors:
Creates a .html file showing the graph using d3.js.
This function returns the name of the .html file. If you want to visualize the actual graph use show().
INPUT:
Warning
Since the d3js package is not standard yet, the javascript is fetched from d3js.org website by the browser. If you want to avoid that (e.g. to protect your privacy or by lack of internet connection), you can install the d3js package for offline use with the Sage command install_package('d3js') or by running sage -i d3js from the command line.
EXAMPLES:
sage: graphs.RandomTree(50).show(method="js") # optional -- internet
sage: g = graphs.PetersenGraph()
sage: g.show(method = "js", vertex_partition=g.coloring()) # optional -- internet
sage: graphs.DodecahedralGraph().show(method="js", force_spring_layout=True) # optional -- internet
sage: graphs.DodecahedralGraph().show(method="js") # optional -- internet
sage: g = digraphs.DeBruijn(2,2)
sage: g.allow_multiple_edges(True)
sage: g.add_edge("10","10","a")
sage: g.add_edge("10","10","b")
sage: g.add_edge("10","10","c")
sage: g.add_edge("10","10","d")
sage: g.add_edge("01","11","1")
sage: g.show(method="js", vertex_labels=True,edge_labels=True,
....: link_distance=200,gravity=.05,charge=-500,
....: edge_partition=[[("11","12","2"),("21","21","a")]],
....: edge_thickness=4) # optional -- internet
TESTS:
sage: from sage.graphs.graph_plot_js import gen_html_code
sage: filename = gen_html_code(graphs.PetersenGraph())