FluidDiagrams: Web-Based Information Visualisation using JavaScript and WebGL

dc.contributor.authorAndrews, Keithen_US
dc.contributor.authorWright, Benedicten_US
dc.contributor.editorN. Elmqvist and M. Hlawitschka and J. Kennedyen_US
dc.date.accessioned2014-12-16T07:21:06Z
dc.date.available2014-12-16T07:21:06Z
dc.date.issued2014en_US
dc.description.abstractMuch attention has been focused on the provision of information graphics and visualisations inside a web browser.Currently available infovis toolkits produce graphical output by either injecting SVG nodes into the DOM orusing the JavaScript Canvas 2D API. FluidDiagrams is a prototype information visualisation framework writtenin JavaScript which uses the WebGL 3D JavaScript API for its output, falling back to Canvas 2D as necessary,via the Three.js library. Six visualisations are currently implemented: bar chart and line chart, scatter plot andparallel coordinates for multidimensional data, and cone tree and hyperbolic for hierarchies.Anecdotally, visualisations using SVG nodes in the DOM for output can become rather sluggish when displayingmore than a few dozen items. Visualisations using Canvas 2D exhibit similarly slow performance. WebGLutilises hardware acceleration where available and promises much better performance for complex visualisations,potentially in the order of many thousands of items without becoming unresponsive.A comparison of parallel coordinates visualisations with 100 records in 20 dimensions compared three implementations:FluidDiagrams (WebGL), FluidDiagrams (Canvas 2D), and D3 (using SVG nodes). They achieved62, 6, and 10 frames per second respectively. The FluidDiagrams (WebGL) implementation was able to render1,000 records in 20 dimensions at 18 frames per second, compared to 1 and 6 respectivelyen_US
dc.description.seriesinformationEuroVis - Short Papersen_US
dc.identifier.isbn978-3-905674-69-9en_US
dc.identifier.urihttps://doi.org/10.2312/eurovisshort.20141155en_US
dc.publisherThe Eurographics Associationen_US
dc.subjectI.3.4 [Computer Graphics]en_US
dc.subjectGraphics Utilitiesen_US
dc.subjectGraphics Packagesen_US
dc.titleFluidDiagrams: Web-Based Information Visualisation using JavaScript and WebGLen_US
Files
Original bundle
Now showing 1 - 1 of 1
Loading...
Thumbnail Image
Name:
043-047.pdf
Size:
1.32 MB
Format:
Adobe Portable Document Format
Collections