Igor Oliveira

@igorol·2 public vizzes

Customizing Axes

This bar chart displays the population of the top 10 most populous countries using 2018 United Nations estimates. It demonstrates customized D3 axes, removing default domain lines and tick lines while applying custom tick formatting and labels. The code uses d3.csv, scaleLinear, scaleBand, axisBottom, and axisLeft from D3 v5 to render the SVG, with population values multiplied by 1000 and formatted using d3.format.

Jan 6, 2020

Loading thumbnail…

Let's make a face with D#.js

A yellow circle face with black-outlined features animates its right eyebrow in a quick bouncing motion. The face is built entirely with D3.js v5 selections and SVG shapes, including circles for eyes and an arc-generated path for the mouth. The code uses D3's `arc` generator for the mouth, `transition` with `duration` for the eyebrow animation, and positions elements via template-literal transform attributes. The left eyebrow remains static, highlighting the asymmetry of the moving right eyebrow.

Jan 4, 2020