All svelte projects

A WebGL 3D, VR/AR Data-cluster component

This is the first prototype of a 3D dataviz component that allows dataset (rows and columns) to be displayed and explored with seamless visual transitions through various presentations defined by the data field types.

Visualizing an Election

We extend our 3D (VR) dataviz component to visualize an election datasets, showing a geographic hex-map for the UK constituencies and a radial chart showing the party sizes.

Visualizing the UK 2024 Election

We used our 3D (VR) dataviz component to visualize the UK 2024 election, comparing it to the 2019 election, which shows a dramatic change of fortune for the two main UK parties.

Svelte QMUL Project Management App

We used D3 and Svelte (with Layercake) to build an in-house project management app for Queen Mary's College London (QMUL). Using a pseudo-physics force-directed network allows one to find correlations in the project dataset.

Line to Stacked Area Chart with Svelte Transitions

This chart transitions from a conventional multi-line chart to a stacked area chart, using Svelte transitions. LayerCake and D3 add ballast to the foundations. The y axis can be switched from fixed to dynamic.

Circular Bar Chart Component with Svelte, LayerCake and D3

This is a little demo of a circular bar chart, built using Svelte, LayerCake and a little D3.

A Binary Tree with Svelte, D3 and Layercake

A client wanted a recreation of the rather superb binary tree demo by R2D3. Without appropriating the specific aesthetics but building a configurable component that could be used to demonstrate binary trees in action and teach machine-learning.

Svelte Scatterplot Component with Gapminder-esque Demo

We used Svelte (with Layercake) to build a little scatterplot component with selectable axes and toggled log-plots. This makes for an easy Gapminder-alike demo with the classic income/population/life-expectancy dataset for countries.

Svelte Pollen Sketches

We used Svelte (with Layercake) to build a minimal app as a prelimary for an in-house tool for analyzing large pollen-count datasets. With customized dataviz the principal features and correlations of the dataset can be brought into sharp focus.

Bespoke Charts with Svelte, D3 and LayerCake

In order to present their data on discrimination against Asian-Americans in the United States, Dataface required some bespoke interactive charts, based on some attractive inhouse designs. They wanted the charts done with Svelte and suggested using the LayerCake library, which provides a clever Svelte based scaffold for D3 etc. dataviz.