Browsing Large Graphs with Tile Pyramids and Sleeve Routing in the Browser
- Lev Nachmanson ,
- Xiaoji Chen
We present a new way to visualize a large graph in the style of online geographic maps. The method builds a tile pyramid for semantic zoom: at every zoom level the labels of the highest-ranked nodes remain readable, just as the names of major geographical features stay readable on those maps. The edges are routed by a method we call sleeve routing, which searches the dual graph of a Constrained Delaunay Triangulation to select a sequence of triangles through the free space, then applies the funnel algorithm to compute a shortest path inside the selected sleeve. We apply several heuristics to speed up the routing. We implemented our approach in the WebGL renderer of MSAGLJS, an open-source TypeScript library for graph visualization in web browsers, with the entire pipeline running client-side, without a dedicated server. Our benchmark suite contains nine graphs with up to 32,768 nodes and 236,978 edges, and measures browser-side parsing, layout, routing, and tile-pyramid construction.