multimodal random

100%

multimodal random

✓ Published0🌍 Public

Last edited Dec 5, 2016

Created on Dec 5, 2016

Three normal distributions appear as horizontal dot plots of 10,000 samples each: blue around 25, red around 75, and purple mixing both at equal probability. A purple histogram below aggregates the mixed distribution into 50 bins. Built with D3 v4, the example uses `d3.randomNormal`, `d3.histogram`, and linear scales, rendering SVG circles and rectangles from procedurally generated random data.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

mixed multimodal random 2d

This example shows a 2D scatterplot of 10,000 points, where the x-coordinate is sampled from either a normal distribution centered at 75 or one centered at 25, while the y-coordinate comes from a normal distribution centered at 50. The result is a clear bimodal cluster pattern. Using d3.v3 and the d3-random API, it generates random normal values, then maps them to SVG coordinates via a linear scale. The code appends red circles with radius 1 to the SVG canvas, rendering the distribution as a dense point cloud.

PPatrick Wojda

84% match

Loading thumbnail…

Distribution Scatter 1

This example visualizes a dynamic scatter plot of 500 values sampled from a normal distribution using `d3.randomNormal`. Vertical rectangles represent each data point, positioned along the x-axis and layered with low opacity. Every five seconds, the background and foreground rectangle colors transition to a new palette, cycling through six predefined color schemes. The visualization is built with D3 v6, rendered as SVG, and uses `transition.attr` to animate color changes over one-second durations.

WWaseem Medhat

72% match

Loading thumbnail…

Distribution Scatter 3

Transparent rectangles in 45-degree rotation render the distribution of 500 samples from a Pareto distribution, each rectangle's width fixed at 25 pixels. Every five seconds, a palette randomly selects a background and foreground color pair, triggering `d3.transition` with 1000-millisecond durations on both the background `rect` and the foreground rectangles. The SVG animation cycles through six predefined color schemes, from teals to violets, while the rectangles maintain a 0.02 opacity. The visualization uses `d3.randomPareto` to generate data and `d3.selectAll` with `.enter()` to bind it to SVG elements.

WWaseem Medhat

69% match

Loading thumbnail…

random generator

Ten randomly positioned orange circles on a grey scatter plot animate to new coordinates whenever a “change data” button is clicked. The circles pulse by expanding and contracting their radius, and their fill color briefly shifts to red during the transition. Built with React and D3 v7, the visualization uses `d3.scaleLinear` for axes, `d3.randomUniform` for generation, and chained `transition` calls with an `easeSin` easing function. All rendering is SVG with animated updates.

Bbart

69% match

Loading thumbnail…

Uniform Random III

This example generates 10,000 random points within a fixed width and height, then computes their Voronoi diagram using `d3.geom.voronoi` with a clip extent matching the SVG canvas. Each Voronoi cell is rendered as an SVG path, filled with a color from a cubehelix scale (`d3.scale.cubehelix`) that maps the cell’s polygon area to a hue range. The coloring transitions smoothly from bright green to deep purple as area increases, creating a visually textured mosaic. The code uses D3 v3, the custom cubehelix interpolation library, and random uniform sampling.

Mmbostock

69% 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

69% match

Loading thumbnail…

Uniform Random

A grid of 3,000 circles appears one by one at random positions across a 960×500 SVG canvas. Each circle starts with a radius of zero and animates outward to a radius of two pixels via D3's `transition.attr`. The animation uses `d3.timer` to append ten new circles per frame, driven by a custom `uniformRandomSampler` function that returns `[Math.random() * width, Math.random() * height]` coordinates. This demonstrates a simple, lightweight approach to generating and animating random scatter points with D3 v3.

Mmbostock

68% match

Loading thumbnail…

Distribution Scatter 4

A grid of semi-transparent rounded rectangles rotates about the center, with each rectangle’s angle determined by a sample from a beta distribution with parameters 1 and 4. The rectangles are drawn using d3.v6’s selection and transition APIs, with a background rectangle that also transitions its fill color. Every five seconds, the visualization randomly selects a new color palette from a predefined list, causing both the background and the foreground rectangles to smoothly fade to their new colors. The data consists of 600 random samples generated via `d3.randomBeta`, mapped through a linear scale to rotation angles between 0 and 80 degrees.

WWaseem Medhat

68% match