Xiaoji Chen | Searcharxiv

arXiv2026

Browsing Large Graphs with Tile Pyramids and Sleeve Routing in the Browser

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. The renderer's demo can be seen at https://microsoft.github.io/msagljs/renderer-webgl-sleeve/index.html. MSAGLJS is available on GitHub (https://github.com/microsoft/msagljs) and as NPM packages (@msagl/core, @msagl/drawing, @msagl/parser, @msagl/renderer-svg, @msagl/renderer-webgl -- all on https://www.npmjs.com/).

cs.CG↗

arXiv2015

GraphMaps: Browsing Large Graphs as Interactive Maps

Algorithms for laying out large graphs have seen significant progress in the past decade. However, browsing large graphs remains a challenge. Rendering thousands of graphical elements at once often results in a cluttered image, and navigating these elements naively can cause disorientation. To address this challenge we propose a method called GraphMaps, mimicking the browsing experience of online geographic maps. GraphMaps creates a sequence of layers, where each layer refines the previous one. During graph browsing, GraphMaps chooses the layer corresponding to the zoom level, and renders only those entities of the layer that intersect the current viewport. The result is that, regardless of the graph size, the number of entities rendered at each view does not exceed a predefined threshold, yet all graph elements can be explored by the standard zoom and pan operations. GraphMaps preprocesses a graph in such a way that during browsing, the geometry of the entities is stable, and the viewer is responsive. Our case studies indicate that GraphMaps is useful in gaining an overview of a large graph, and also in exploring a graph on a finer level of detail.

cs.GR↗