nazirahmad50

@nazirahmad50·3 public vizzes

Cars Report

A minimal D3.js visualization displays a single large circle centered in an SVG canvas. The circle is rendered with a radius of 200 pixels using `select` and `append`, demonstrating basic SVG shape creation. The example includes an ES6 module exporting a string message, though the message is not currently displayed. The page loads D3 v5 from a CDN, applies global CSS resetting margins, and uses an HTML file that references an external bundle script. The Data comes from no external source, serving purely as a template for VizHub projects.

Apr 10, 2020

Loading thumbnail…

Cars Report

This example renders a simple web page titled “Cars Report” that displays the static text “Hello VizHub!” inside a message div. It demonstrates basic VizHub project structure by importing a local ES6 module (`myMessage.js`) and using D3’s `select` API to set the text content of the DOM element. The page styling is defined in an external `styles.css`, which centers the text at a large font size. The visualization itself shows no car data or interactive elements, serving purely as a minimal template for how D3 and local modules can be composed.

Apr 10, 2020

Loading thumbnail…

Let's make a face with D3.js!

A yellow smiley face is drawn with D3.js using SVG shapes, including a circle head, two eyes, eyebrows, and an arc-based mouth created with the `d3.arc` helper. The eyebrows animate by chaining `transition().duration(2000)` calls to move them up and down repeatedly. The code demonstrates foundational DOM manipulation, selecting the SVG element with `d3.select`, appending groups and shapes, and using transforms to position features relative to the canvas center. The face is rendered entirely with static SVG attributes, with no external data source.

Apr 9, 2020