Development
Software stack
In order to exploit the GPU for rendering the road networks in a Web browser, Dash Sylvereye makes use of the Leaflet.js and PixiJS JavaScript libraries in a transparent way for the developer.
Leaflet.js provides the layer of tiled Web maps as well as zooming and panning capabilities, whereas the 2D animation library PixiJS provides the road network drawing primitives accelerated by WebGL.
Leaflet.PixiOverlay provides a Leaflet.js overlay that embeds PixiJS drawings into a Leaflet.js map tile layer behind the scenes.
All these elements are encapsulated inside a React component and then transpiled to build a Plotly Dash component.
Dash Sylvereye also makes use of other third-party JavaScript libraries, such as JSTS for defining edge hit polygons, RBush for efficiently finding edge hit polygons that has been clicked by the user, and Chroma.js for computing color scales for edges, nodes, and markers.
Likewise, Dash Sylvereye network loading routines make use of NetworkX and Shapely to enable Dash Sylvereye to import road networks from the OpenStreetMap project via OSMnx or from GraphML files.