Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bowl of Fruits-General Update Pattern

Public visualization

Bowl of Fruits-General Update Pattern

0 stars0🌍 Public
NNohaS
Last edited Sep 11, 2023
Created on Sep 10, 2023

This visualization demonstrates the general update pattern for D3.js data manipulation. It shows a bowl of fruits whose contents change over time—initially displaying five apples, then removing one apple, replacing another with a lemon, and finally removing a second apple. The example uses D3 v5’s `selection.selectAll`, `.enter()`, `.merge()`, and `.exit()` methods to handle DOM updates, with the `fruitBowl` function managing the SVG circle and text elements. The `scaleOrdinal` color and radius scales map fruit types to visual properties.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.

Comments

Sign in to join the discussion.

MIT Licensed