Andrew

@andrewhong5297·3 public vizzes

Cars Report

This example depicts a minimal cars report, displaying the make of the first vehicle from a hardcoded JSON array. A pre-formatted element renders the text "Honda" at a large font size. The implementation imports the parsed car data from a separate `cars.js` module, then uses the standard Document Object Model (DOM) API—specifically `document.getElementById` and `textContent`—to update the page. The visualization relies on D3 version 6 for data handling, though the core output is a simple text readout of the data.

Sep 9, 2020

Loading thumbnail…

San Francisco Temperatures Area Chart

A week of San Francisco temperatures is shown as an area chart, with time on the x-axis and temperature on the y-axis. The chart uses D3 v5 to load CSV data, scales with `scaleTime` and `scaleLinear`, and renders an SVG area path via `d3.area` with a basis curve. Customized axes remove domain lines, and axis labels are added with rotated text. The chart includes a title and margins, with data parsed from timestamps and numeric temperatures.

Sep 8, 2020

Loading thumbnail…

San Francisco Temperatures Area Chart

This area chart visualizes a week of temperature readings in San Francisco, sourced from a CSV dataset of timestamped temperature values. The visualization uses D3 v5’s `csv` loader to fetch data, `scaleTime` and `scaleLinear` for axes, and an `area` generator with `curveBasis` to render the smoothed, maroon-filled area. Customized axes with tick lines and labels, plus a title, are built using `axisBottom` and `axisLeft`, while the SVG rendering includes margins and a bottom-aligned time axis.

Sep 8, 2020