KurtCodeAnyWhere

@KurtCodeAnyWhere·2 public vizzes

Word Cloud Example

This example visualizes the frequency of family and first names from genealogical data using D3.js word clouds. The visualization displays the most common names as text, with font size scaled proportionally to their occurrence count, rendered in an animated layout using SVG. The implementation leverages the `d3.layout.cloud` module, which uses a canvas's `getImageData` method for text bounding measurements, along with the `d3.scale.linear` for size mapping and `d3.scale.category20` for coloring. Users can switch between datasets via toolbar buttons that load different JSON files.

Aug 17, 2019

Loading thumbnail…

Word Cloud Example

An interactive word cloud visualizes surname and first-name frequencies from JSON datasets, letting users toggle between "Family Names" and "First Names" via toolbar buttons. The d3.layout.cloud JavaScript library computes non-overlapping word placements using an Archimedean spiral collision algorithm, while D3.js (v3) SVG rendering displays the final text with font sizes scaled linearly. Each dataset is filtered, sorted, and truncated to the top 120 words, with animation during layout computation. Word rotation alternates randomly between horizontal and vertical orientations.

Aug 17, 2019