Jessica Tucker

@jtucker1973·3 public vizzes

SVG Fundamentals

This example displays a bare HTML page with an empty body, demonstrating the minimal structure required to begin working with SVG, CSS, and JavaScript. It uses standard HTML elements and does not include any visualization logic or data rendering. The code references the React Starter project as a follow-up resource, but the page itself contains no interactive or graphical output. It serves as a starting point for building SVG-based visualizations in a web environment.

Jun 11, 2023

Loading thumbnail…

Fork of Vega-Lite API Template

This example uses the Vega-Lite API to render an interactive scatter plot of automobile data from the UCI Machine Learning Repository’s Auto MPG dataset. It displays miles per gallon on the x-axis, horsepower on the y-axis, with color encoding by origin and size encoding by weight, plus tooltips for car names. The visualization fetches data via `d3.csv` and renders using `vega`, `vega-lite`, and `vega-lite-api`, with a custom config for axis styling and a Vega Tooltip handler. The chart is fit to the full window size.

Dec 3, 2022

Loading thumbnail…

SVG JPT

This example demonstrates a simple arrangement of colored circles on an SVG canvas, with one circle containing a small face composed of additional black and red circles. A single black line connects the central circle to the rightmost one. The visualization is built using plain SVG elements—`circle` and `path`—embedded directly in an HTML page, with no additional JavaScript libraries or data sources involved. It serves as a minimal illustration of manual SVG drawing within a static document.

Nov 13, 2022