Skip to main content
100%

Basic Scatter Plot

✓ Published0🌍 Public
CCurran Kelleher
Last edited Nov 22, 2017
Created on Nov 22, 2017

This example shows a basic scatter plot of the classic Iris dataset, mapping sepal length to the x-axis and petal length to the y-axis. Each flower is rendered as a gray circle, with no color or shape encoding for species. The visualization uses D3 v4 within a React-style "margin" pattern, where a custom `d3.margin` function encapsulates the SVG margin convention. It loads CSV data with `d3.csv`, converts numeric fields, and positions circles using linear scales (`d3.scaleLinear`) over computed extents.

AI-generated description

An idea for encapsulating the margin convention, inspired by the React render prop pattern.

The goal is to find a pattern that can also encapsulate the notion of small multiples.

forked from <a href='http://bl.ocks.org/curran/'>curran</a>'s block: <a href='http://bl.ocks.org/curran/f4ca72a38bcbb5893d37ce48ed9d4796'>Margin Convention with Scatter Plot</a>

mit Licensed

Similar vizzes