Rasinj

@Rasinj·9 public vizzes

download using "Copy All as cURL" from chrome dev tools (https://www.quora.com/How-can-I-download-all-images-from-Google-image-search-engine-at-once)

This example shows a shell-based pipeline that downloads a batch of images from a web page, using Chrome DevTools’ “Copy All as cURL” command to capture network requests. It pipes copied cURL commands through `pbpaste`, then `awk` to strip the trailing character and append a sequential filename (e.g., `>>1.jpg`) before executing each command with `bash`. The rendering relies entirely on standard Unix utilities—`pbpaste`, `awk`, and `bash`—with no JavaScript libraries or visualization frameworks, and the data source is the clipboard contents from the DevTools network tab.

Nov 17, 2019

Loading thumbnail…

Rename md5 files (https://unix.stackexchange.com/questions/392129/rename-all-files-in-a-directory-to-the-md5-hash-of-their-filename-not-content)

This example demonstrates a shell one-liner that renames every file in the current directory to the MD5 hash of its filename while preserving the original file extension. The script iterates over each file with a `for` loop, computes the hash using `md5sum` on the filename with `echo -n` to avoid a trailing newline, and then prints the original and new names with `echo`. It uses parameter expansion to strip the hash’s trailing metadata and extract the extension via `${i##*.}`. The output shows the mapping without actually performing the rename, as the command only prints the `--` separated pair.

Nov 17, 2019

Loading thumbnail…

fresh block

This example demonstrates a simple data-join and transition sequence in D3.js, where an array of values enters a visualization as blue text labels that slide horizontally from right to left before fading out. The code uses d3.selectAll, data joins, and transition methods like `.delay()` and `.duration()` to animate positions and opacity. Rendered as an SVG with D3 v3.5.5, the visualization steps through a hardcoded dataset of numbers and letters, showing the enter, update, and exit lifecycle stages. The timeline is driven by setTimeout calls that push new and removed elements over time.

Apr 30, 2016

Loading thumbnail…

fresh block

A sequence of labels animates in a staggered leftward slide as the dataset changes over time. The initial empty array is replaced by successive arrays of increasing length containing numbers and letters, demonstrating how new elements enter from the right with a blue fill, while removed elements fade out. Built with D3 3.5.5, the code uses `d3.select`, `svg.selectAll`, and the `transition()` API with specified durations and easing to update text positions and styles along a fixed x-coordinate.

Apr 30, 2016

Loading thumbnail…

D3 Example

A D3 example demonstrates a linear scale mapping a data domain of 1 to 5 into a pixel range of 0 to 200, driving the x-position of text elements in an SVG. Using `d3.select` and `scale.attr`, the code binds arrays of numbers to text nodes, updating their position and fill color on a five-second timer. The `enter`, `update`, and `exit` selections manage the text lifecycle, showing red, blue, green, cyan, and magenta labels as the dataset changes. This illustrates data joins with `d3.scale.linear` and `svg.append`.

Apr 30, 2016

Loading thumbnail…

fresh block

A sequence of letters and numbers slides into place along a vertical scale, then exits in red, demonstrating a simple data join animation. The SVG text elements are bound to an array of values that changes over time using timed `setTimeout` calls. The code uses D3.js scales, including `d3.scale.linear` and `d3.scale.ordinal`, along with selection methods like `.enter()`, `.exit()`, and `.transition()` with a linear ease and per-element delay. The animation cycles through adding and removing items, showing enter, update, and exit states.

Apr 30, 2016

Loading thumbnail…

fresh block

A series of text labels slide from right to left in an SVG canvas, each pausing briefly before the next enters. The animation cycles through a predefined sequence of values, including numbers and letters, using timed `setTimeout` calls. Built with D3.js (version 3.5.5), the code uses `selectAll`, `data` joins, and `transition` with `duration` and `delay` to animate elements. Data arrays are passed to a render function, which handles entering, updating, and exiting text nodes. The ordinals scale positions labels vertically, while a linear scale is defined but unused.

Apr 30, 2016

Loading thumbnail…

fresh block

This interactive animation demonstrates a dynamic text list where items slide into place from the right and then disappear. Using D3.js scales and the general update pattern, the code binds an array of numeric and alphabetic values to SVG text elements. Each new entry transitions horizontally to the left with a staggered delay, while exiting elements fade out. The visualization cycles through predefined data sets on timed intervals, showcasing the enter, update, and exit lifecycle with `transition.attr` and `style` changes.

Apr 30, 2016

Loading thumbnail…

fresh block

Three blocky text elements, carrying the numbers 2, 3, 3, and 4, fade from deep red to light blue over three seconds on a full-screen SVG canvas. The code uses D3.js v3 to bind a simple static array to SVG text nodes, setting their positions with fixed coordinates and a data-driven y-offset. A `transition().duration(3000).ease("bounce")` animates the color change, while the initial dimensions and basic styling are applied directly via `.attr()` and `.style()` calls. No external data source is loaded; the visualization relies entirely on the inline array.

Apr 30, 2016