Bossmaen

@Bossmaen·3 public vizzes

Fork of D3 Starter

A minimal demonstration of a D3 starter template, this example renders the text “Hello D3 version 7” directly in the browser body using D3’s `select` method. The page imports the D3 v7 library from a CDN and uses a separate `bundle.js` file to execute the JavaScript logic. The styling is kept intentionally simple, with centered, oversized text, to focus on the basic setup and the transition from D3 version 6 to version 7.

Dec 12, 2022

Loading thumbnail…

Making a Bar Chart

A bar chart displays the population of ten countries using 2018 data from the United Nations World Population Prospects. The visualization loads a CSV file with population values and maps them to horizontal bars, with country names on the y-axis and population counts on the x-axis. Using D3 v5, the code employs `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the SVG chart, while `csv` loads the data and `max` determines the scale domain. The bars are rendered as SVG rectangles with steelblue fill.

Mar 21, 2019

Loading thumbnail…

Hello VizHub!

This example displays the text "Hello VizHub!" in a large, centered message on a steelblue background, styled with the Ubuntu font. It demonstrates a basic D3.js v5 setup using the `select` function to update the DOM, while an SVG rect is drawn as a decorative block. The code imports a local ES6 module, `myMessage.js`, to supply the text, and renders the visualization as static SVG within an HTML page.

Nov 3, 2018