Skip to main content
SimilarExport ZIP
100%

Untitled

โœ“ Published1๐ŸŒ Public
Yyejichun@naver.com
Last edited Dec 3, 2021
Created on Nov 12, 2021
Forked from HTML Starter

This visualization displays a word cloud of Korean terms related to artificial intelligence and technology, with word size representing the frequency or weight of each term in the dataset. The words are arranged in a space-filling layout with random 0 or 90 degree rotations, colored using a five-color ordinal scale. Built with React and D3.v4, the code uses the `d3.layout.cloud` API to calculate word placements, then renders SVG text elements with the Noto Sans KR font, processing keyword-frequency data imported from JavaScript modules.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnailโ€ฆ

Untitled

A word cloud displays Korean terms related to artificial intelligence, with font size scaling by frequency. Term frequencies come from an external dataset in `sample3.js`. The visualization uses the `d3.layout.cloud` plugin to position words, while `d3.scaleOrdinal` and a custom color palette assign fills. Words render as SVG text elements with the Noto Sans KR font, rotated randomly between horizontal and vertical orientations.

Eedindirangu
94% match
Loading thumbnailโ€ฆ

Untitled

This example shows a word cloud of COVID-19 public health guidance, with words sized by frequency and randomly rotated horizontally or vertically. The visualization uses the d3.layout.cloud plugin to compute word placement, while d3โ€™s selection and transition APIs animate words entering, updating, and exiting as the data changes. Text is rendered as SVG elements with Impact font, colored via a categorical color scale, and centered within a 500ร—500 canvas.

Yyili222
79% match
Loading thumbnailโ€ฆ

Word Cloud-3

This visualization displays a word cloud built from frequency data in a TSV file, using font size to encode the magnitude of each term. The words are rendered as SVG text elements with random rotations and a categorical color scale. The layout is computed with the `d3.layout.cloud` plugin, which uses a collision detection algorithm to place words without overlapping. Data is loaded via `d3.tsv` and processed with array methods before the cloud is drawn and animated by the pluginโ€™s step function.

Kkaviya-ds
78% match
Loading thumbnailโ€ฆ

Word Cloud

This word cloud uses D3โ€™s `d3.layout.cloud` to position words by frequency, with font size scaled by each termโ€™s count. The layout runs inside a force simulation, and the rendering draws the words onto an SVG canvas using `d3.select` and `text` elements. The visualization reads a local JSON dataset of words and counts, then animates the cloudโ€™s appearance with a smooth rotation and fade-in transition. Colors are applied from a categorical palette to differentiate word groups, while the overall layout adapts to the containerโ€™s size.

SSree Likhith
76% match
Loading thumbnailโ€ฆ

Word Cloud-3

This example displays a word cloud visualization using the d3.layout.cloud plugin, which arranges words from a TSV data file based on their frequency values. The code filters the dataset, maps each entry to a text-size pair, and uses the cloud layout with custom rotation, padding, and the Impact font. Words are rendered as SVG text elements with colors from a category20c scale, appearing animated as the layout algorithm places them across a 500ร—500 canvas area.

0007ebey
76% match
Loading thumbnailโ€ฆ

Word Cloud-3

This word cloud visualizes the frequency of terms from a CSV/TSV dataset, with word size proportional to their numerical `frequency` values. It uses the Jason Davies `d3.layout.cloud.js` library to calculate word placements within a 800x500 space, applying random rotations and the "Impact" font. The visualization renders words as SVG `<text>` elements, with colors assigned from the `d3.scale.category20c()` palette and triggered via `d3.tsv()` data loading.

Kkaviya-ds
76% match
Loading thumbnailโ€ฆ

Word cloud

This example displays a word cloud of 17 English words, such as "Hello," "Everybody," and "Coding," using the `d3.layout.cloud` API to position the words within a 450x450 SVG canvas. The implementation uses `d3.select`, `svg.append`, and `text` elements to render each word, with font size, rotation, and position determined by the cloud layout algorithm. The data consists of a static JavaScript array of words, and the visualization demonstrates how the `d3.layout.cloud` library integrates with the D3.js v4 framework within a React project.

Kkaviya-ds
76% match
Loading thumbnailโ€ฆ

Untitled

A word cloud layout algorithm arranges words of varying font sizes within a bounded space. The browserify.js example generates random words and sizes, then renders them as SVG text elements with rotations and Impact font, centered on a 500ร—500 canvas. The core d3-cloud library uses a canvas-based sprite collision detection technique via `getImageData` to place words without overlap, employing an Archimedean spiral search pattern and a dispatch event system to signal layout completion.

Ttharanitaran
76% match