deven1998

@deven1998·3 public vizzes

Untitled

This example demonstrates how D3 can bind data to pre-existing HTML list items and update them dynamically. The visualization shows five initial values displayed as text within `<li>` elements, with a button that triggers removal of the fourth data point. The code uses D3 v4’s selection API, including `.data()`, `.text()`, and `.exit().remove()`, all inside an HTML page with inline JavaScript. It relies on the `d3.select` and `d3.selectAll` methods to manipulate the DOM.

May 10, 2021

Loading thumbnail…

ba 401 Data loading Data

This example demonstrates a minimal data-loading workflow using the browser’s native Fetch API to retrieve a remote dataset from a GitHub Gist. The page consists of a single HTML file with inline JavaScript that calls `fetch(url)` and logs the resulting Promise to the console. No rendering, styling, or data processing occurs; the example solely illustrates the first step of asynchronously fetching external resources in a plain HTML/JavaScript context, without any additional libraries or frameworks.

May 10, 2021

Loading thumbnail…

BA 401 Devendra Singh

A yellow smiley face drawn with SVG appears on screen, with two circular eyes, a curved mouth, and rectangular eyebrows. The visualization demonstrates fundamental DOM manipulation in D3.js by animating the eyebrows’ vertical position. Using D3 selections and chained transitions, the eyebrows move upward and return over repeated two-second intervals. The code builds the face from basic SVG shapes—circles, a path generated with `d3.arc`, and rectangles—while `transition().duration()` controls the animation timing. No external data is used; the rendering is purely programmatic.

May 7, 2021