Reproducible Randomness

100%

Reproducible Randomness

✓ Published0🌍 Public

Last edited Dec 13, 2022

Created on Dec 13, 2022

Five gold horizontal bars of varying length represent five random decimals generated with the `seedrandom` library, making the sequence reproducible via `Math.seedrandom('hello')`. Each bar's width and its corresponding numeric label are drawn using D3 v7 selections and SVG `rect` and `text` elements. The visualization demonstrates how setting a random seed produces consistent, deterministic output in an otherwise stochastic process.

AI-generated description

Testing out the randomseed JS library for making a reproducible random number generator.

Setting a random seed makes the "random" number generation process reproducible so that the same sequence is generated every time the script is run.

The sequence can be changed by changing the random seed (the string in the Math.seedrandom() call at line 3 in main.js).

MIT Licensed

Similar vizzes

Loading thumbnail…

Sample Bar Chart

This example displays a randomized dataset of 25 numeric values as a series of vertical bars, with each bar’s height proportional to its corresponding data point. The bars are rendered as inline-block HTML `div` elements styled with teal backgrounds and fixed widths. The sample uses D3 v7’s data join pattern—`d3.select().data().enter().append()`—to bind the data and generate the bars, while `Math.random()` produces the source values. The visualization demonstrates a basic bar chart without axes or scales, relying on a simple pixel-to-value mapping.

KKrittaprot Tangkittikun

73% match

Loading thumbnail…

D3 Random Abstract Art

This example generates a grid of 100 colored rectangles whose fills use randomized pairs from the d3 `schemeCategory10` palette via `d3.scaleLinear`. As the mouse hovers over a square, that rectangle and its entire row are re-appended to the SVG to bring them to the foreground, while the square’s width and height are scaled up or down by a factor of three or four. Clicking anywhere reloads the page to generate a fresh random composition. The visualization is built with D3 v6 selections and SVG rendering, and includes a small instruction bar.

CCaroline Ghisolfi

71% match

Loading thumbnail…

Grouped bar chart v4

This grouped bar chart displays five series of ten random samples each, using color to distinguish the series and vertical bars to represent values. Built with D3 v4, it renders as SVG and uses `d3.scaleBand` for the categorical axes, `d3.scaleLinear` for the value axis, and `d3.scaleOrdinal` for color mapping, with data generated in JavaScript via `Math.random`.

BBaptisteL54

70% match

Loading thumbnail…

Creating SVG Bar Chart

This example demonstrates a simple SVG bar chart built with D3 version 6. It generates a random dataset of ten values using `d3.range` and `Math.random`, then renders each value as a `rect` element, with its height and vertical position proportional to the data. The chart also labels each bar with a `text` element showing its value. The code uses D3’s `select`, `selectAll`, `data`, and `enter` methods to bind data and create the SVG elements, with bars colored using an RGB fill based on each value.

DDasbach.EJ

70% match

Loading thumbnail…

Untitled

This example shows a bar chart with ten bars, each representing a randomly generated value. The chart is rendered as an SVG graphic, with bars drawn in steel blue. The code generates the data internally using a loop and `Math.random`. It uses D3.js v4 APIs including `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` to create the axes. The visualization is built within a React starter template, though the core logic is a simple D3 script.

Bbl75d

70% match

Loading thumbnail…

By me Designed random bar graph

This bar graph displays a shuffled sequence of nine values ranging from 100 to 900, rendered as uniformly spaced vertical bars. The chart uses a linear y-axis scale and a banded x-axis scale to position each bar, with alternating teal shades distinguishing adjacent bars. Built with React and D3 v5, the visualization loads random data via a custom `useData` hook, which shuffles a range using D3’s `shuffle` and `range` functions. The SVG output is sized dynamically based on the window, and the scaling is handled through `scaleLinear` and `scaleBand`, with inner padding applied to the x-scale for visual separation.

VVikil Lakkavatri

70% match

Loading thumbnail…

Document

The visualization generates a random sequence of twenty charts, cycling through line charts, pie charts, and bar charts. Each line chart displays four smoothed monotone curves with colored dots, while the pie chart and bar chart render categorical and time-based data. Built with D3 v4, the code uses `d3.line`, `d3.arc`, and `d3.axisBottom`/`d3.axisLeft` to produce SVG output. Data is procedurally generated using `d3.randomUniform` and `d3.range`, with each chart styled via inline attributes and CSS classes.

DDabbar

70% match

Loading thumbnail…

Generate 25 Random number in the interval 0-30

This example shows a static bar chart of 25 randomly generated numbers between 0 and 30, with each bar’s height proportional to its value. The visualization uses D3.js (version 3.5.5) to bind the dataset to `div` elements, setting each bar’s height via `.style("height", ...)` and styling them with the CSS class `bar` (teal, fixed width, inline-block). The data are generated on the fly using `Math.random()*30` in a loop, while the original R code uses `runif(25, 0, 30)` to produce the same distribution. The chart intentionally omits axes, focusing solely on relative bar lengths for comparison.

CChristosT

70% match