Chih-Hsin Chen

@esa0624·4 public vizzes

Taiwan Earthquake

This visualization analyzes one year of earthquake data from Taiwan’s Central Weather Administration, showing seismic activity on a zoomable Mercator map and an interactive scatterplot. Users can select a year and adjust the x and y axes to explore correlations between magnitude, depth, and other attributes. The map uses d3.geoPath with topojson to render county boundaries, while the scatterplot applies d3.scales and axes. Circles are sized by magnitude and colored by selected categories, with hover tooltips and a legend that updates dynamically.

May 10, 2024

Loading thumbnail…

Scatterplot for World Dataset

This scatterplot visualizes the relationship between GDP and gasoline price across countries using a cleaned world dataset from a GitHub repository. It displays individual data points as gray circles, with GDP on the x-axis and gasoline price on the y-axis, both scaled using d3.scaleLinear. The visualization is rendered as SVG using D3 v6, with axes generated via d3.axisLeft and d3.axisBottom. The code fetches CSV data with d3.csv, applies parsing functions, and includes labeled axes plus a title, all within a React-free HTML page.

Apr 30, 2024

Loading thumbnail…

Fork of Fork of Scatterplot for peng bird dataset

This scatter plot visualizes the Palmer Penguins dataset, encoding flipper length on the x-axis against body mass on the y-axis, with each point’s color indicating one of three penguin species. The code loads CSV data via `d3.csv`, uses `d3.scaleLinear` and `d3.extent` to set scales, and renders the points as SVG circles. It also draws axes with `d3.axisLeft` and `d3.axisBottom`, while a switch function assigns distinct colors per species, and axis labels are added via SVG text elements.

Apr 30, 2024

Loading thumbnail…

Fork of Earthquakes on Map

This map depicts global earthquake epicenters, with circle size scaled by magnitude and color coding by depth category—shallow (red), intermediate (blue), and deep (green). Tectonic plate boundaries overlay the landmasses, visually confirming that seismic activity concentrates along plate edges. The visualization uses d3-geo projections, topojson for world map data, and USGS earthquake feed JSON. Interactive features include drag-to-rotate, zoom, dropdown filters for depth and magnitude, tooltips, and clickable circles that open event details.

Apr 30, 2024