Connor Rothschild

@connorrothschild·4 public vizzes

Fork of transform question

This interactive React and D3.js visualization renders a data-driven smiley face using SVG shapes. The code defines facial features through SVG primitives, including ellipses for the face, ears, and nose, circles for eyes and pupils, and paths generated by `d3.arc` for the mouth and ears. Transformations such as rotation and translation position each component within a central group. The example demonstrates how D3’s arc generator and React’s declarative syntax combine to construct a composed vector graphic.

Dec 15, 2021

Loading thumbnail…

Fork of Final

This interactive visualization combines a world map of suicide counts with a linked time-series histogram. Circles on a natural Earth projection encode suicide numbers by area, colored by category, with tooltips revealing country-specific details. A brushable histogram below filters the map by year, updating the displayed bubbles. The visualization uses React, D3 v5 modules like `geoNaturalEarth1`, `geoPath`, `scaleSqrt`, and `brushX`, rendering to SVG. Data comes from a CSV of suicide rates merged with city coordinates.

Nov 16, 2021

Loading thumbnail…

Automation and Its Impact on Jobs

This scatterplot shows the relationship between median income and the probability of automation for various occupations, with circle size representing total employment and color indicating typical education requirements. The visualization uses d3.v3 to load CSV data from a GitHub repository, map values to x and y scales, and render SVG circles with dynamic sizing. Hover interactions appear implemented via a tooltip element, while the chart includes axis labels for median income and automation probability, emphasizing how higher-paying jobs generally face lower automation risk.

Sep 3, 2019

Loading thumbnail…

Automation and Its Impact on Jobs

This scatterplot visualizes the relationship between median income, probability of automation, and total employment across occupations. Each circle represents an occupation, with position encoding income and automation risk, while circle size reflects total employment and color distinguishes typical education requirements. The visualization uses d3.csv to load data, d3.scale.linear for scales, d3.svg.axis for axes, and includes an interactive tooltip. Data comes from automation.csv, rendered as SVG with hover effects for detailed exploration.

Aug 7, 2019