Caleb Crum

@ccrum292·3 public vizzes

Fork of Polished World Map

This example shows a world map with country boundaries rendered as an SVG using the Natural Earth projection. The visualization uses `d3.geoNaturalEarth1` for projection and `d3.geoPath` to draw landmasses, graticules, and interior borders from World Atlas TopoJSON data. The map is styled with teal landmasses, light gray ocean, and subtle graticule lines. The React component structure uses `d3.json` to load the TopoJSON and `topojson.feature` and `topojson.mesh` to extract geographic features.

Dec 28, 2023

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to create an interactive scatter plot of the Auto MPG dataset from the UCI Machine Learning Repository. The visualization maps miles per gallon to the x-axis, horsepower to the y-axis, and encodes origin as color while weight drives circle size. Tooltips display car names on hover. The code registers Vega, Vega-Lite, and Vega-Tooltip through `vl.register`, then loads CSV data asynchronously with `d3.csv`. Rendering uses a fit-to-window SVG view with custom axis and label styling from a shared config object.

Dec 20, 2023

Loading thumbnail…

Fork of Hello HTML

This example displays a single static circle centered in an SVG canvas. It demonstrates the minimal structure of an HTML page containing an SVG element with a circle defined by explicit `cx`, `cy`, and `r` attributes. The page uses inline CSS to remove margins and hide overflow, and the circle is rendered directly via SVG markup without any JavaScript libraries or data sources. The visual is a plain, unanimated red circle against a white background.

Dec 19, 2023