Volcano
Districts
and History
Database from the Smithsonian Institution in CSV format. Dataviz done with Python scripts and D3.js cartography.

Wildfire
Satellite
Detection
Fire radiative power data provided in JSON format. Radial timeline and oriented bubbles in D3.js

Fire
Weather Index
Fire weather index dataproduct in NetCDF format. Map projection in Python Folium package.

Lava Flow
in Hawaii
Lava flow from TIF to GeoJSON format. Map projection in Leaflet cartography.

Paris
Olympics
Cooling energy demand from TIF to GeoJSON format. Map projection in Leaflet cartography.

EarthScan
Flooding
H3 to GeoJSON flooding depth data in worst case RCP scenario. Map projection in Leaflet cartography.

Deforestation
Tree species data from TIF format to JSON files. Map projection in KeplerGL

Phase Space
Python generated JSON output of simple mathematical functions. Trajectories and circles created in D3.js

MGClimDeX
Project
Gridded model output and population database in NetCDF format. Map projection in D3.js

News
and Bots
JSON data output of web scrapers and python postprocessing. Vertical timeseries in D3.js

Path
Projects
CSV data of K-means iterations, fossil fuel emissions and atmospheric CO2. Paths created in D3.js

Volcano
Ash Plumes
GeoJSON model output from ash dispersion models. Map projection in D3.js

Windstorm
in Georgia
Weather Research and Forecasting (WRF) model output from NetCDF to tiles. Map projection in D3.js and Leaflet cartography.

Antarctica
NOAA Reanalyses data in NetCDF and Icebergs CSV data. Map projection in D3.js

Hierarchy
Distributions
Theoretical exercise using D3.js lines, circles, stacked dots, polygons and paths on a given number of elements in three different levels.

Hurricanes
and Oceanic
Oxygen
HURDAT database in CSV format and CMIP5 output from NetCDF to JSON. Spider diagram and map projection in D3.js.

Oceanic
Carbon Export
NetCDF data from different dataproducts into DAT and JSON format. Map projections and cross sections in D3.js

Pandemic
in Galicia
Institutional data from CSV to JSON format. Timeseries and mountains in D3.js

Ocean
Acidification
CMIP5 mode output in NetCDF and JSON formats. Global NetCDF projected in D3.js

Ocean
Acidification
CMIP5 model output from NetCDF to JSON format. Map projections and time series in cartesian axis in D3.js

Sinking
Carbon in the
Atlantic Ocean
Sediment trap data from CSV to JSON format Rain diagram and map projection in D3.js

types

magnitudes

01 /
Mountains
Magnitudes

02 /
Daisies
Magnitudes

03 /
Diamonds
Magnitudes

04 /
Force Bubbles
Magnitudes

05 /
Force Hex Bubbles
Magnitudes

06 /
Treemap
Magnitudes

07 /
Voronoi Diagram
Magnitudes

08 /
Starry Skies
Magnitudes

09 /
Japanese Waves
Magnitudes

10 /
Spider Diagram I
Magnitudes

11 /
Spider Diagram II
Magnitudes

12 /
Small Multiples
Magnitudes

13 /
Oriented Bubbles
Magnitudes

14 /
Stacked Dots
Magnitudes

15 /
Spirals
Magnitudes

16 /
Anemone
Magnitudes

time series

17 /
Lines in Cartesian Axis
Time Series

18 /
Areas in Cartesian Axis
Time Series

19 /
Vertical Axis
Time Series

20 /
Sankey
Time Series

21 /
Rings
Time Series

22 /
Flights Takeoff
Time Series

23 /
Rain
Time Series

24 /
Radial Axis
Time Series

networks

25 /
Collapse Tree
Network

26 /
Force Nodes
Network

27 /
Radial Tree
Network

28 /
Satellites in Orbit
Network

cartography

29 /
D3.js Dots
Cartography

30 /
D3.js Regions
Cartography

31 /
D3.js Trajectories
Cartography

32 /
D3.js Tiles
Cartography

33 /
D3.js Polar
Cartography

34 /
D3.js Hexbin
Cartography

35 /
D3.js Contour
Cartography

36 /
D3.js NetCDF
Cartography

37 /
D3.js DAT
Cartography

38 /
Folium Contour
Cartography

39 /
KeplerGL Contour
Cartography

40 /
KeplerGL Dots
Cartography

41 /
Leaflet Tiles
Cartography

42 /
Leaflet Contour
Cartography

43 /
Leaflet Hexbin
Cartography

44 /
ThreeJS Elevation Model
Cartography

The full set of dataviz types can be downloaded here, including magnitudes, time series, networks and cartography.

about

I’m a dataviz cowboy, riding through D3.js mountains, looking for beautiful and wonderful data-driven storytelling.

Born and raised in Galicia, I studied Physics at Santiago de Compostela University, Spain, diving afterwards into the unfathomable mysteries of oceanography, achieving an MSc. in Applied Physical Oceanography at the British Antarctic Survey in Cambridge, UK, and a PhD. in Ocean Climate Modelling in Paris, France.

Since then I have invested my time into the graphic currency, embracing infographics and modern data visualization tools, just in time for the 2011 release of D3.js developed by Mike Bostock.

Beyond that, I love theatre plays, sharp dialogues and old printed posters, from classic operas to 1972 Olympics’ design.

Dataviz Cowboy is part of the Graphic Prototype industries.

contact

For project development, training courses or just sharing ideas, please contact me at:

geoPy

training

Postprocessing of raw input data files is a delightful step in data analysis and data format conversion for javascript web-based visualization. This modules help reading, plotting and converting all sorts of georeferenced input data formats.

Data Structures

Basic input data formats such as CSV or JSON are usually translated into Pandas format to clean and filter the data we aim for, using arrays, dictionaries and lists. The output is converted into JSON or Parent/Child JSON format.

Basic Plots

A quick overview of the data can be done with plots using the Matplotlib library through scatter plots, regression fit, time series and histograms, together with all necessary plot formatting in text, legend and labels.

GeoData
Conversion

Model output, dataproducts and observational datasets often come in georeferenced data formats, such as NetCDF, TIF, SHP or MAT files. Reading and all possible conversion among these file formats are explained. Generating an output in either JSON or GeoJSON format is also useful.

Geodata
Regrid and Mask

Georeferenced data comes in a wide variety of map projections. In this module how to regrid both NetCDF and SHP files is explained. Masking dataproducts over particular regions defined by SHP files is also covered in this section.

Cartography

Mapping largely involves representation of either discrete elements, contour plots and areas or binning via hexagons or other polygons. These operations are performed to ultimately display the data in D3.js, Leaflet, Folium or KeplerGL.

Text Analysis

Text analysis from web scrapers or social network feeds can be done with the NLTK python package for basic statistics such as word frequency or word rank.

d3.js

training

The golden standard of modern, contemporary data visualization. All that is needed to display magnitudes, time series, networks and maps is explained in this module, including transformations and interactivity.

Set Up

Basic set up to start writing code in D3.js and to see it working. This includes Observable Notebooks or setting up a local server. D3.js scripts are usually embedded into HTML code plus some CSS styles, a quick review of these basic elements is also covered.

Basic Shapes

The heart and soul of D3.js resides into drawing very basic shapes such as circles, lines or rectangles. The attributes of these shapes are subject to mathematical operations, including examples of loops, numerical operations, functions and conditional statements.

Plug Data

Plugging data into D3.js shapes bring the whole dataviz into life. This module cover three simple data structures: CSV, JSON and GoogleSheets formats, and how to plug them into our dataviz project.

Advanced Shapes

D3.js goes well beyond circles and lines to draw also polygons, arcs, lines and areas on cartesian axis, adding all possible axis of creativity.

Transformations

Conventional layouts can be modified through simple transformations of the groups of elements. This includes rotation of elements and display elements into rectangular or Circular grids.

Interactivity

New layers of information can be easily added or explored via a number of interactive elements, such as zooming, dropdown menus, sliders or tooltips, all of them through smooth transitions.

Cartography

Maps are one of the oldest data visualization tools. This section covers map projections, dots, lines, trajectories and regions on a map, tile filling of the space and hexagonal binning. These features are plotted using D3.js on native or Leaflet cartographies.

Project Development

Data visualization merges with journalism when telling a story, few clues are given regarding layout axis, layers of information, choice of background color, legends, credits and data sources.