birthday guesser (unshuffled version)

100%

birthday guesser (unshuffled version)

✓ Published0🌍 Public

Last edited Jun 17, 2017

Created on Jun 17, 2017

A birthday-guessing game asks viewers to answer nine yes/no questions about whether their birthday appears on a series of calendars. The visualization renders 367 cards, each highlighting a subset of dates via colored rectangles on 2016 calendar grids. Using D3 v4, the code builds an SVG calendar layout with `d3.timeDays`, `d3.timeFormat`, and scale functions, then animates card transitions. Clicking yes or no circles advances through the card sequence, ultimately revealing the guessed date. The interface relies on hover effects and mouse events to drive the interactive puzzle.

AI-generated description

Here is the puzzle, I address with this block:

Can you guess a birthday (just 1 out of 366 days, i.e. no year) under the following conditions:

just ask 9 yes/no questions
all questions must be independent, i.e. one question must not depend on an answer of a previous question
answering the questions should be straight forward, i.e. any 6-year old kid can answer them

(unshuffled version)

forked from <a href='http://bl.ocks.org/EE2dev/'>EE2dev</a>'s block: <a href='http://bl.ocks.org/EE2dev/c229c55b0fbead16ed68d9456be06a59'>birthday guesser (unshuffled version)</a>

mit Licensed

Similar vizzes

Loading thumbnail…

birthday guesser (unshuffled version)

TThanaporn-sk

100% match

Loading thumbnail…

birthday guesser (unshuffled version)

This visualization presents a birthday-guessing puzzle where nine yes/no questions aim to identify a specific day of the year. It displays multiple color-highlighted calendars, one per question, with marked dates representing the possible birthday. The user answers each question by clicking a yes/no button. The visualization uses D3.js to animate the transitions between cards, revealing the solution by progressively narrowing down the calendar. A static calendar grid and interactive answer buttons make the process clear, and the final answer is shown after all questions are answered.

663anp3ca

94% match

Loading thumbnail…

birthday guesser

This interactive visualization presents a birthday-guessing game in which a calendar highlights a subset of dates and the user answers yes/no questions. The tool displays a year grid, and each of nine cards recolors days according to a shuffled set of magic numbers; the user’s answers progressively narrow the possible dates. The code uses D3 v4 with SVG and animations, drawing calendars via `d3.timeDays`, `d3.timeFormat`, and a quantized color scale, and handles the interaction with click events that advance through the cards.

EEE2dev

93% match

Loading thumbnail…

birthday guesser (unshuffled version)

The visualization presents a set of nine monthly calendars, each highlighting a subset of days, which together encode a birthday through independent yes/no questions. A user answers whether their birthday appears on each calendar, and the code uses those answers to narrow the possibilities. The visualization uses D3.js v4 to render the calendars as SVG and animates the sequence of questions. The unshuffled version displays the days in their natural calendar order, allowing the user to track the guessing process step by step.

EEE2dev

92% match

Loading thumbnail…

Number guessing

This visualization presents a classic number-guessing card trick. It displays a series of shuffled cards, each containing a subset of numbers from 1 to 60, generated by a mathematical algorithm. The user answers "Ja" (yes) or "Nein" (no) to whether their chosen number appears on a highlighted card. After all cards are shown, the program calculates and reveals the hidden number. Built with D3 v4, it uses SVG elements and `d3.transition` for smooth card movements and the final dramatic fade-in of the solution.

EEE2dev

75% match

Loading thumbnail…

number guessing (english)

The example demonstrates the classic "magic number" card trick, where a user mentally selects a number between 1 and 60 and then answers yes or no as six shuffled cards are presented one by one. Each card contains a distinct subset of numbers, and the user’s cumulative yes/no responses are used to compute the hidden number. The visualization uses D3 v4 to render SVG cards and animated transitions, scaling each card to the foreground for interaction and shrinking it after each answer. The final solution is revealed with a slow text fade-in after the last card, using D3’s transition and style methods.

EEE2dev

72% match

Loading thumbnail…

family calendar

This radial calendar maps each family member’s birthday to an angle around a circle, with age increasing toward the center. A blue sweep highlights the current year’s elapsed days. Hovering reveals name, birth date, and age via a tooltip. The visualization is built with D3 v4, rendering as SVG, with birthdays loaded from a JSON file.

663anp3ca

68% match

Loading thumbnail…

Calendar Alternate Orientation v4 update

This calendar visualization displays daily fact counts for 2016 as an exploded month grid, with each day colored on a red-to-green scale based on value intensity using a d3.scaleQuantize and a polylinear color gradient. The code uses d3.timeDays, d3.timeMonths, and d3.timeYears to structure the layout, while d3.timeFormat handles date parsing and week/month calculations. A hover tooltip appears via d3.csv-loaded data, and the animation-ready SVG layout arranges months in rows with white grid lines separating cells.

BBBischof

65% match