Alireza-Dezfoolian

@Alireza-Dezfoolian·4 public vizzes

Group bar chart with tooltip

A grouped bar chart displays population distributions across six U.S. states, with each state’s bars broken down by seven age brackets. The chart uses a vertical axis labeled “Population” and a horizontal axis listing state abbreviations, with a color-coded legend identifying each age group. Built with D3 v4 and the d3-tip plugin, it renders as SVG and shows exact values on mouseover via tooltips. The code employs `d3.scaleBand` for grouped positioning, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` for colors.

Jan 16, 2018

Loading thumbnail…

Rotating Earth

An animated orthographic projection of Earth rotates continuously, with its scale oscillating as the globe spins. The map and graticule paths update every 10 milliseconds using `d3.geoOrthographic` and `d3.geoPath`, while a click toggles the rotation. The land polygons come from a Natural Earth GeoJSON file, and the SVG rendering includes a clickable text prompt to start or stop the animation.

Jan 14, 2018

Loading thumbnail…

Colour-full force

Twenty-eight colored circles drift across a black SVG canvas in a soft, gooey cluster. Each circle is assigned a rainbow hue and a random radius, with alternating circles receiving a blurred filter effect that makes them blend together. The motion is driven by D3’s `forceSimulation` with charge, center, and collision forces, while the rendering uses SVG circles and a `feGaussianBlur` with a `feColorMatrix` filter to create the liquid-like appearance.

Jan 14, 2018

Loading thumbnail…

Dynamic pie chart

A dynamic pie chart renders five slices whose sizes and positions regenerate randomly every four seconds. D3 transitions animate the arc paths and percentage labels smoothly between states, using `attrTween` and `d3.arc` to interpolate start and end angles. The visualization updates in real time, with labels repositioned via centroid calculations and colors assigned through a sequential scale with the `interpolatePlasma` color scheme.

Jan 8, 2018