Skip to main content
100%

Gist 612909

✓ Published0🌍 Public
Aamundo
Last edited Oct 6, 2010
Created on Oct 6, 2010

This visualization displays interlinear glosses for an Indonesian sentence, pairing each word with its English translation. The example shows four words—"mereka," "di," "jakarta," and "sekarang"—alongside their glosses, with metadata for language, author, date, and page. The code uses D3.js, specifically `d3.forceSimulation`, to position the word-gloss pairs in a network layout, likely with nodes and links connecting each word to its corresponding gloss. The data comes from a JSON object containing the sentence, translation, and structured gloss array, rendered as a force-directed graph to reveal the alignment between source and target languages.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 9232647

This example uses D3.js to visualize a network of interconnected text fragments, where each node is a sentence and links connect related phrases. The graph layout is driven by `d3.forceSimulation`, positioning nodes spatially based on their textual proximity. The visualization displays raw text content directly within each node, revealing the thematic clusters and semantic associations among the provided technical paragraphs. Rendering relies on SVG elements managed through D3’s data joins, with no additional libraries beyond core D3 modules.

Aandybak
65% match
Loading thumbnail…

Gist db32a113f546aa03b43c0e1f84f80d28

The visualization shows a force-directed network graph of GitHub gist data, with nodes representing individual gists and links showing relationships between them. It uses d3.forceSimulation to compute the layout, with node size encoding gist size and color indicating file type or language. The rendering relies on SVG elements updated per tick via the simulation’s tick event. The code loads a static JSON file containing preprocessed gist metadata, and does not use canvas or WebGL. The visualization highlights clustering patterns among related gists, revealing emergent communities in the dataset.

335degrees
62% match
Loading thumbnail…

Gist 160b8b16e4775e57e6f7736c7739dfd9

This visualization uses D3.js to render a network of interconnected nodes, positioned with `d3.forceSimulation` and drawn as circles on an SVG canvas. The code applies a color scale to nodes based on their degree (number of connections), and uses `d3.drag` to make nodes interactive and movable. It reads data from a simple array defined in the script, and displays the graph without axes or geographic elements. The example demonstrates force-directed layout and basic interactivity, with node colors and link strokes providing visual encoding of network structure.

Aandrei-antal
60% match
Loading thumbnail…

Gist 5173197

This visualization maps the sentiment of emoji reactions in a GitHub gist, displaying a force-directed network of emoji characters positioned by their co-occurrence patterns. The code uses `d3.forceSimulation` to compute the layout and `d3.select` with SVG elements to render nodes and links, with the emoji labels sourced directly from the gist file. Each emoji appears as a text node, and the simulation’s charge and link forces separate frequently paired icons. The rendering approach relies on D3’s data join and tick event handling, with no additional libraries beyond D3’s core modules.

Aalessioalex
60% match
Loading thumbnail…

Gist 70625

This example visualizes a force-directed graph built with the D3.js library, using `d3.forceSimulation` to compute the layout. The graph’s nodes are rendered as text labels on an HTML5 Canvas, where each label displays a single character from the Gist’s source code. The visualization shows the spatial clustering of these characters, and the code calculates how many times a given character appears in a node’s adjacency list using a custom `f(ra,n)` method. The rendering approach relies on Canvas’s `fillText` for drawing labels, with the simulation updating positions each tick.

DDylanFM
60% match
Loading thumbnail…

Gist e7cd0d06da2caa59a162f8736d788999

This example visualizes a dynamic force-directed network graph, mapping relationships between interconnected nodes. It uses the D3.js library with `d3.forceSimulation` to calculate node positions and interactions, while rendering the graph on a canvas with `d3.geoPath` for styling. The code appears to fetch data from a gist file, then draws nodes as circles and links as lines, with a hover interaction that highlights connected elements. The visualization adapts to screen resizing and runs continuously, showing the simulation’s real-time updates as forces settle the layout.

AAnaMal08
59% match
Loading thumbnail…

Gist 6499e03ffdfc7479408da70f20af3625

This visualization maps the semantic relationships between words extracted from a text corpus. It shows a network of nodes and edges, where connected words cluster together based on their contextual similarity. The layout uses a force-directed graph, likely powered by d3.forceSimulation, to position nodes and links. The code loads a spaCy NLP model (`en_core_web_lg`) to compute word vectors, and filters out stop words using NLTK’s stopwords list before processing the raw text.

AArizonaTay
59% match
Loading thumbnail…

Gist 3681441

This visualization shows a live feed of sentences that are added to a collection, with each new sentence rendered as a separate element on the page. The code uses Backbone.js to manage a `sentences` collection, binding events like `add` and `reset` to render the items. A `sentenceKeyup` handler triggers transliteration of typed input, and `createOnEnter` adds new sentences when the user presses Enter. The rendering relies on Backbone’s view system, updating the display whenever the collection changes, while `sentences.fetch()` loads initial data from the server.

Aamundo
59% match