Scientific & Medical Visuals

Latest Posts (Tagged: D3.js)

Fractal Visualizations: Iterated Function Systems

tubelli_fractals

An experiment in creating fractals within the browser using JavaScript and D3.js. The fractals that are represented include: Koch curve, Koch snowflake, Cesàro fractal, Lévy dragon, Heighway dragon, Sierpinski gasket, Sierpinski carpet, binary tree, and Cantor set.

Tags: ,

Airport Route Map Visualization

airportmap

I am somewhat of an aviation geek. Since I was young, I enjoyed watching planes take off and land. To me, airplanes are an extraordinary accomplishment in engineering.

I decided it would be a fun data visualization challenge to depict the route maps for every commercial airport and airline. There are of course existing tools that already do this, including openflights.org and flightmapper.net, but I wanted to make one of my own.

The primary tools I used to build this interactive map were D3.js, Mapbox, Leaflet, JavaScript and jQuery. The map also features arc.js and typeahead.js.

Data came from many sources, wherever I could find the necessary information. That included Wikipedia, official airport websites, official airline websites, iata.org, and openflights.org. I intend to use this tool to show the most current route maps for every commercial airline; however, due to the constantly changing schedules of airports and the airlines that serve them, data is prone to be out-of-date or incomplete.

Tags: , ,

Virtual Oscilloscope

tubelli_oscilloscope_large

I felt like doing a more engineering-related visualization, so I made a simple oscilloscope visualization using D3.js and JavaScript. An oscilloscope is a device that shows an electrical signal as a function of time. This is a very basic visualization mimicking an oscilloscope that offers 4 types of waves: a sine wave, a square wave, a triangular wave, and a sawtooth wave. The x and y properties of both the signal and display properties can be changed.

The dials were created with jQuery-Knob.js.

Tags: ,