Filip Pavlove

@pavlovator·4 public vizzes

Geo Map V1

This choropleth map of the United States visualizes the percentage of adults over 25 with a bachelor’s degree, using education data from freeCodeCamp. County boundaries are rendered as SVG paths via `d3.geoPath()`, with TopoJSON county data converted to GeoJSON using the `topojson.feature` API. The map is built in React, though the logic operates through D3 v5’s `d3.json()` for asynchronous data loading and selection-based rendering. A descriptive title and subtitle accompany the visualization, which is styled with a CSS-driven layout.

Jan 17, 2023

Loading thumbnail…

Fork of Polished World Map

This example displays a world map with country boundaries and graticules, rendered using SVG. The map uses a Natural Earth projection via `geoNaturalEarth1` and `geoPath` to draw landmasses, a sphere outline, and graticule lines. Data comes from the World Atlas TopoJSON, processed with `feature` and `mesh` from topojson. The map is styled with a teal land fill and subtle interior borders, presented within a React component that loads data asynchronously using `useData` and `d3.json`.

Jan 17, 2023

Loading thumbnail…

D3 - Sol

This example reproduces a Sol LeWitt art piece as an interactive SVG drawing. It creates a full-screen canvas that fills the browser window, using D3 version 6.6.1 to select the body element and append an SVG with dimensions matching the viewport. The artwork is rendered dynamically, with the code importing only the `select` function from D3 to manage the SVG creation. The piece focuses on geometric form, translating LeWitt's conceptual wall drawings into a web-based medium.

Jan 17, 2023

Loading thumbnail…

Fork of Data viz - course 1

This example presents a single, animated SVG path rendered as a deeppink stroke on a blank canvas. The path is defined directly within the markup with a lengthy `d` attribute, and CSS controls its motion through the `stroke-dasharray` and `stroke-dashoffset` properties, looping the dash pattern with an `animation` keyframe. The effect draws and redraws the line in a continuous cycle. Built with React and SVG, the visualization relies on plain HTML, CSS, and JavaScript, with no additional data sources or external libraries used beyond the standard web platform.

Jan 17, 2023