Tell us what works and what could be better. We read every submission.
@alper·22 public vizzes
This example presents a plain-text reference table for the Jujutsu version control system, listing common commands alongside their purposes and effects. The content is organized as a Markdown table with rows for actions like `jj status`, `jj diff`, and `jj undo`, each paired with a brief explanation. The table uses no external libraries or APIs, relying solely on standard Markdown syntax for formatting. It also includes supplementary sections on safety commands like `jj op restore` and automation tips for headless scripts, all derived directly from the source document.
This example demonstrates a configured PaperWM.spoon setup for the Hammerspoon window manager, showing how to bind keyboard shortcuts for tiled window navigation, swapping, resizing, and space switching. The code uses `hs.loadSpoon` to load the PaperWM module and defines hotkeys via `PaperWM:bindHotkeys`, including focus movement, window centering, cycle width/height adjustments, and moving windows across Mission Control spaces. It also sets `PaperWM.swipe_fingers` and `swipe_gain` for trackpad gesture control before starting the tiling system.
This example shows a ranked list of coffee venues, sorted by their distance from the user’s current location. It uses the Dioxus framework with the `use_resource` hook to fetch venue data from the Cuppings JSON API, and the `init_geolocator` and `use_geolocation` functions to retrieve GPS coordinates. Venues are sorted with the `geoutils::Location` haversine distance calculation, while custom serde deserialization extracts formatted addresses from nested Google data.
The visualization shows a list of Twitter profile URLs, presumably blocked accounts, arranged as an unstructured text collection with no graphical encoding. It displays the raw links in a plain, vertical list without any visual hierarchy or interactive features. The code uses no visualization libraries or APIs, relying solely on standard HTML and Markdown formatting to render the content. The data source is the embedded Twitter handles, presented as static hyperlinks without additional processing or analysis.
This example generates a daily note template for Obsidian, using the Templater plugin to insert the current date and query task lists for items due, scheduled, or completed that day. It also runs a shell command through `icalBuddy` to fetch calendar events from specified calendars, reformats the output with `sd` to turn bullet points into headings and remove email addresses, and appends the result as a section with blank lines for meeting notes. The materialized template shows the rendered output for December 28, 2023, with task queries and placeholder discussion sections.
This example presents a normative Git branching model that emphasizes rebasing and best practices for maintaining a clean, deployable `master` branch. The visualization, authored by alper in a gist, illustrates the workflow through a simple diagram and accompanying text, showing how feature branches are created, rebased, and merged using `git merge --no-ff`. It also includes a flowchart-like representation of the process, with commands such as `git rebase`, `git pull`, and `git push --force-with-lease`, and references GitHub’s pull-request workflow. The data source is the gist’s markdown content, rendered as static images.
This example shows a Fish shell configuration file that customizes the terminal environment with specific locale settings, theme options, and tool integrations. The code sets the `LC_ALL` and `LANG` environment variables to `en_US.UTF-8`, configures the Bobthefish theme with a custom date format and timezone, and defines `FZF_DEFAULT_OPTS` with bindings for previewing files via `qlmanage`, opening files with `open`, and copying output to the clipboard with `pbcopy`. It also references plugin integrations for Pyenv and Exa, though the Pyenv initialization line is commented out, and the Exa plugin link is provided but not activated. The configuration relies on Fish shell’s `set` command and plugin-managed tools.
A choropleth map of Dutch municipalities shows COVID-19 incidence rates per 100,000 residents for the period August 26 to September 8, 2020, colored on a gradient from light to dark blue. The map is rendered using D3 with geographic projections, with each municipality’s fill intensity based on its "Totaal_inc100000" value. Hovering over a region displays a tooltip with the municipality name, total cases, and incidence rate, while the accompanying legend and title clarify the scale and time window.
This example demonstrates a basic seating arrangement solver that assigns ten people to four rooms with capacities of 2, 3, 4, and 5. It shows how constraints are enforced: each room’s occupant count must not exceed its capacity, and specific pairs and triples of people must be seated together according to defined wishes. The visualization exposes the `people` array, likely rendering each person’s room assignment. The code uses Array’s `countBy` method to tally occupants per room and defines invariant checks via custom functions `respectCapacity?` and `wishes?`, though no rendering library is specified.
This example demonstrates a Git hook that enforces commit message conventions by checking the first line for an issue number. It shows a Python script using the `sys` module to read the commit message file path passed as an argument. The script opens the file in read-write mode, reads all lines, and examines the first line for a `#` character, which indicates an issue reference. If no issue number is found, the script prints an error message and exits with a non-zero status code, blocking the commit. The code relies on standard Python file I/O and the `sys.argv` list to access command-line arguments, without external visualization libraries.
This example demonstrates a Swift decoding strategy for a trending GIFs API response, using a custom `Trending` initializer that iterates through a nested unkeyed container to parse each `Gif` object. It shows how to skip malformed entries by attempting to decode each item as `Gif` first, and falling back to `AnyCodable` to log and discard problematic records while preserving the valid ones. The code relies on `Decoder`, `KeyedDecodingContainer`, and `UnkeyedDecodingContainer` APIs to filter the data array, ensuring the resulting `data` property contains only successfully decoded GIFs.
A shell script demonstrates the command-line interface of `cmpcodesize.py`, a tool for comparing Swift binary sizes between debug and release builds. It executes all relevant command variations (`-a` for all, `-c` for changed, `-l` for a specific library, `-s` for a specific file) with and without the `-p` flag to produce CSV output files. The script sets environment variables pointing to two Swift build directories and runs the tool against `libswiftFoundation.dylib` to show how the comparison works across different scope options.
The visualization maps Dutch media and political figures who publicly defended or apologized for Donald Trump, listing names with linked sources and quotes. It uses a static HTML page with hand-positioned text blocks connected by thin lines, likely laid out with custom CSS or SVG rather than a simulation library. The data comes from tweets, articles, and broadcasts curated by the author, with each entry showing the person’s affiliation and a URL to the original statement. No interactive or dynamic rendering is present; the layout is fixed and text-based.
This example maps the step-by-step process of setting up a fresh project on OS X, as documented in a gist. It displays the ordered terminal commands and instructions in a visual flowchart-like layout, highlighting the sequence from installing Homebrew to restarting the Django server. The visualization uses the raw text from the gistfile1.md as its data source, rendering each numbered step as a node with connections to show the workflow. The code employs d3.forceSimulation to position the nodes and d3.geoPath for any spatial elements, though the primary focus remains on the textual procedure.
A collection of 20 colored circles is arranged diagonally across an 800x500 SVG canvas, each with an increasing radius and positioned along a line from the top-left toward the bottom-right. The circles use D3's category20 color scale to assign each one a distinct color, with black stroke outlines. Hovering over any circle triggers a Tipsy tooltip (Facebook-style) that displays the circle’s index and its color value in matching colored text, demonstrating how to combine D3 data binding with jQuery-based tooltips for interactive SVG elements.
The example shows A* routing through a connection graph of Yorckstraße, a street in Berlin, with nodes representing street exits and transit entrances like S1NordS and U7S. It demonstrates shortest-path calculations between locations such as Großgörchenstraße and U7, printing the resulting paths and neighbor lists. The implementation uses the `aStar` function from `a_star.py`, which relies on a `PriorityQueue` to expand nodes, with distance and heuristic functions guiding the search. The output lists computed routes and finishes in 0.1 seconds.
This example demonstrates how to retrieve a Dutch law’s metadata by querying a government web service. It shows the result of a search for the identifier “BWBR0001824,” returning the law’s official title and related details. The script uses the `suds` library with an `ImportDoctor` to handle SOAP encoding issues, connecting to the `wetten.overheid.nl` WSDL endpoint. It prints the client configuration before executing `searchByBWBId`, then outputs the returned data structure. The visualization is absent; the code focuses solely on the data-fetching step.
This visualization shows the open call for coaches for an OpenTechSchool Git for Beginners workshop, listing two volunteer names and their contact emails. It reads the data directly from a markdown gist file and renders it as a simple, readable text layout using plain HTML and CSS. The code does not employ any charting libraries or interactive features—it presents the static content as a formatted document, making the workshop details and coaching sign-up process immediately visible.
This example demonstrates a simple ZeroMQ PUSH/PULL message-passing pattern, where one process continuously generates random workloads and another receives and prints them. The pushventilator.py script uses `zmq.Context` and a PUSH socket to connect to a PULL socket bound on port 5558 by the pullsink.py process, sending random integers between 1 and 100 via `sink.send()`. The pullsink.py process uses `receiver.recv()` in a loop to display each received value, showing a real-time unidirectional data flow without any acknowledgment or synchronization beyond the initial connection.
The Prince of Networks notes visualization maps a network of philosophical fragments from Latour’s text, showing how concepts cluster through shared keywords. It uses `d3.forceSimulation` to position nodes and `d3.select` with `transition.attrTween` to animate links between related ideas. The data comes from a gist file, parsed into nodes and edges, with each node labeled by its excerpt.
This example shows a PHP script that imports a large archive of tweets (47,455) into the ThinkUp database. The script reads a text file containing JSON-encoded tweets, parses them line by line, and inserts each tweet into the database via the PostDAO. It extracts fields like tweet ID, text, timestamp, and user ID, hardcoding author information and converting the tweet's created_at string into MySQL-compatible datetime format. The importer runs from the command line and is designed to batch-process the archive, printing a key for each inserted post. The visualization highlights how legacy tweet data can be migrated into ThinkUp's storage layer for later analysis.
This example shows a hierarchical cluster dendrogram rendered as an SVG, with nodes positioned by depth and leaves spread vertically. It loads tree data from a JSON file using `d3.json`, then applies `d3.layout.cluster` to compute node coordinates. Links are drawn as curved paths via `d3.svg.diagonal`, while each node appears as a circle with a text label, offset depending on whether it has children. The code uses `window.onload` to trigger the visualization, and the SVG canvas is sized 960 by 2200 pixels with a translated group for layout.