Joanna Szpadkiewicz

@Szpadzik·3 public vizzes

Organization Connection Graph

This force-directed graph maps connections between people and companies, derived from board membership data. Each node represents a person or organization, with edges indicating relationships like board membership or personal meetings. The visualization uses D3 version 7’s `forceSimulation` engine, combining `forceManyBody` for repulsion, `forceLink` for edge constraints, and `forceCenter` to keep the layout anchored. Interactive dragging is enabled through a custom `drag` interaction, while circles, text labels, and lines are rendered as SVG elements.

Jun 13, 2022

Loading thumbnail…

Fork of Fork of Smiley Face Part IV

A yellow smiley face is rendered as an SVG graphic, centered on a 960 by 500 viewport. The face consists of a yellow circle with a black stroke, two black eyes, and a mouth drawn as an arc. The visualization uses React functional components to structure the SVG elements, while D3’s `arc` generator from the `d3` module computes the mouth path. Static dimensions and positions are defined as JavaScript constants, with all shapes rendered directly without external data.

Nov 12, 2021

Loading thumbnail…

Fork of Smiley Face Part IV

This example shows a smiley face composed of a yellow circle with a thick black stroke, two black eyes, and a curved mouth. Using React components for the SVG structure, it employs D3’s `arc` generator to define the mouth path with specified inner and outer radii and start and end angles. The `BackgroundCircle` component renders the face, while React’s `ReactDOM.render` mounts the app with fixed dimensions for width, height, and stroke width.

Nov 12, 2021