JaxonDvl

@JaxonDvl·9 public vizzes

fresh block

This example renders a blank SVG canvas with a single line of instructional text, “Edit the code below to change me!,” displayed in large monospace font. It demonstrates the basic setup of a D3.v4 visualization project, using `d3.select` to target the document body and `svg.append` to create the text element. The visualization serves as a minimal starting template for further development, with a fixed viewport size of 960 by 500 pixels.

Mar 31, 2017

Loading thumbnail…

fresh block

This example displays a static SVG canvas containing the text “hello d3” in a large monospace font. The visualization is rendered using d3.v4, with the SVG element appended directly to the body. A single text element is positioned at specific x and y coordinates, with font size and family set via D3’s style method. The code demonstrates basic SVG creation and text styling through D3’s selection and append API.

Mar 31, 2017

Loading thumbnail…

JS Bin

This example demonstrates a JavaScript utility for calculating the number of days in a given month, using native `Date` objects and arithmetic to compute the difference between the first day of the target month and the first day of the following month. The code defines two functions: `daysThisMonth()` and `daysInMonth(y, m)`, both logging results to the console via `console.log`. The current month’s day count and a manual check for April 2016 are printed, showing the raw month-length values without any visualization or external libraries.

Apr 7, 2016

Loading thumbnail…

JS Bin

This example demonstrates JavaScript object constructors and method definitions using plain functions and the `new` keyword. It creates a `Task` constructor with properties for `name` and `completed`, as well as `complete` and `save` methods that log actions to the console. Four task instances are instantiated, with one marked complete and the others saved. The code uses no external libraries or data sources, relying entirely on native JavaScript syntax and console output to illustrate basic object-oriented patterns.

Apr 4, 2016

Loading thumbnail…

JS Bin

This example demonstrates a JavaScript function `add10` that returns its input plus ten, with the result 30 logged to the console. The code executes `add10(20)` and prints the output to the browser's console using `console.log`. The implementation is presented in two forms: the compiled "strict" version using `var` and a function expression, and the original source using `const` with an arrow function. The gist contains an HTML file defining the document structure and a JavaScript file with the logic, though no external libraries or data sources are referenced.

Apr 4, 2016

Loading thumbnail…

JS Bin

This example demonstrates a live counter that updates every second, displaying the number of elapsed seconds in the browser and the console. It uses RxJS’s `Observable.timer` to emit sequential integers, which are mapped to formatted strings. The resulting data stream is subscribed to by two effects: a DOM effect that writes the text into a `#app` container, and a console effect that logs each message. The code separates the main data stream from its side effects, following a simple functional reactive programming pattern.

Apr 3, 2016

Loading thumbnail…

Gist 96829331ffd980ee6a4f3ab1196708f1

This visualization presents a structured Git cheat sheet, organizing commands into clear categories like configuration, local and remote branch management, and advanced operations. It demonstrates a comprehensive set of command-line workflows, including branching, merging, stashing, and comparing changes, each paired with practical usage examples. The rendering relies on standard Markdown code blocks and inline formatting to distinguish commands, comments, and options, providing a reference-style layout rather than a data-driven graphic.

Sep 23, 2015

Loading thumbnail…

A set of pure and immutable ES2015 functions aimed to make functional JavaScript more idiomatic.

This example presents a collection of pure, immutable ES2015 utility functions for idiomatic functional JavaScript. It includes array operations such as `combine`, `compact`, `difference`, and `intersection`, object helpers like `merge` and `toMap`, math functions (`min`, `max`, `sum`, `product`), and function decorators including `curry`, `once`, `maybe`, and `pipeline`. The code relies on native JavaScript features like `Array.prototype.includes`, `Set`, `Map`, `Object.assign`, and spread syntax. No external libraries or data sources are used; the gist demonstrates standalone, reusable functional patterns.

Jun 25, 2015

Loading thumbnail…

Here are some things you can do with Gists in GistBox.

GistBox demonstrates how Gists can organize reusable code, documentation, and personal content through a collection of annotated files. The example includes a JavaScript snippet logging the `window` object, a Ruby QuickSort implementation, a Markdown guide for keyboard shortcuts, and a cheesecake recipe. Each file uses plain-text formats or language-specific syntax, with Markdown structuring the documentation and recipe. No external libraries or APIs are involved; the visualization relies solely on the hierarchical display of Gist files and their metadata, sourced directly from GitHub’s Gist system.

Sep 25, 2013