Digital Science for Library Workship

100%

Digital Science for Library Workship

✓ Published0🌍 Public

Last edited Mar 1, 2017

Created on Mar 1, 2017

This example visualizes a list of Digital Science tools, sourced from a gist by Clifford Anderson, as a static text-based layout. It reads the topics from a Markdown file and renders each entry as a clickable hyperlink to its official website. The code uses the D3.js library, specifically `d3.select` and text element creation, to position the items within an SVG canvas. The visualization does not encode data into shapes or colors; instead, it presents the information as a clean, typographic interface for workshop attendees.

AI-generated description

Similar vizzes

Loading thumbnail…

List of Workshops

This example visualizes the schedule and topics of a fall 2015 workshop series, using a gist of raw Markdown as its data source. It renders each workshop as a distinct element, likely a card or list item, with titles, instructors, and dates drawn directly from the parsed text. The code employs a custom JavaScript parser to extract session details and uses d3.js for layout and transitions, though the core rendering relies on simple DOM manipulation via `d3.select` and `text` methods. The visualization emphasizes chronological ordering and thematic grouping, though it does not show interactive filtering or dynamic updates beyond static display.

CCliffordAnderson

76% match

Loading thumbnail…

Gist 466252

This example is a data-art composition built from a personal list of recommended web design and programming books, rendered as an interactive force-directed graph. It visualizes the relationships between books, their authors, and their associated topics (like usability, web standards, JavaScript, Ruby, and Rails) using `d3.forceSimulation` for physics-based layout and dynamic node positioning. Each book title, URL, and annotation from the original text is embedded as textual nodes and links, with the graph’s structure and labels derived directly from the source gist’s content. The rendering approach uses SVG elements updated via D3’s data join, and while no explicit additional libraries are mentioned, the code relies on standard D3 v4+ APIs for simulation, drag behavior, and tick updates to show the clustered, interlinked reading list.

DDylanFM

71% match

Loading thumbnail…

Scholarly Communications Workshops - Fall 2014

This example shows a workshop series schedule for fall 2014, listing each session’s topic, date, and presenter in a text-based layout. The visualization uses a simple HTML structure with headings and lists to group information by week, rendering the content as plain text without charts or graphs. It relies on no external libraries, instead presenting the data directly from a Markdown file that is parsed and displayed.

CCliffordAnderson

70% match

Loading thumbnail…

D3 Workshop: Part 1 - Basic HTML, d3, and Data Binding

This example demonstrates an interactive D3 v4 workshop that teaches basic HTML, d3, and data binding through a hands-on exercise. It shows a button that, when clicked, runs a d3 code snippet targeting paragraphs inside a sandboxed div, while a checklist outlines tasks like adding paragraphs, manipulating text, and binding arrays. The code uses d3.js v4, with d3.select and d3.selectAll to handle DOM selection and manipulation, plus event handling for button clicks. The visualization renders static HTML paragraphs as the primary data display, with the exercise structure guiding users through progressive coding challenges.

IIgathi

70% match

Loading thumbnail…

Gist 3ea15e735c876056ba750785a7ef8362

This example presents a slide deck titled "DH-talk," formatted as a Google Slides presentation. It uses the reveal.js framework to render HTML-based slides, with content drawing from a Gist repository. The presentation focuses on digital humanities topics, and its visualizations are constructed through the `d3.js` library, including `d3.forceSimulation` for network layouts and `d3.geoPath` for geographical mapping. The code demonstrates how to embed interactive charts directly within the slide framework, merging narrative with data-driven graphics for an educational talk.

CCliffordAnderson

68% match

Loading thumbnail…

Gist 34f3e588a35b33357c08853c2370036b

This visualization catalogs AI tools and resources, organizing hundreds of links to libraries and APIs for foundation models, model development, vector databases, and multimodal systems. The layout groups entries by category—such as OpenAI function calling, Microsoft’s BitNet framework, and Hugging Face collections—using a hierarchical list format. It references tools like LM Studio for local deployment, Pyannote for speaker diarization, and Edge-TTS for text-to-speech, with GitHub repositories and documentation pages as primary sources. The rendering relies on standard Markdown headers and hyperlinks to create a browsable, text-based reference.

JJastor11

67% match

Loading thumbnail…

D3 Workshop: Part 1 - Basic HTML, d3, and Data Binding

This example demonstrates a hands-on D3 workshop exercise that introduces basic HTML structure, the D3.js v4 library, and fundamental data-binding concepts. It shows a sandboxed webpage with a button that, when clicked, triggers a JavaScript function to manipulate existing paragraph elements and append new ones based on an array of data. The code uses `d3.select` and `d3.selectAll` to target DOM elements, applies styles and text changes, and employs the data join pattern with `.data()`, `.enter()`, and `.append()` to create new paragraphs. It also attaches click event handlers to dynamically added elements, logging a message and altering their appearance, while the accompanying exercise checklist guides users through modifying the code to reinforce learning.

AAndrewMcKernan

67% match

Loading thumbnail…

D3 Workshop: Part 1 - Basic HTML, d3, and Data Binding

This interactive D3 workshop demonstrates the basics of data binding and DOM manipulation in a live sandbox. It shows how a button click triggers JavaScript to modify existing paragraph elements—changing their text and font size—while also appending new paragraphs from a hardcoded array. The code uses D3 v4’s `selectAll`, `data`, and `enter` methods to bind the array `myData` to new `<p>` elements, then adds click interactivity via `on`, which changes the clicked paragraph’s text and color. The example also includes an HTML checkbox exercise list, though only the button-driven D3 logic is functional.

DDeveloperJeffb

66% match