Patrick

@pwfontes·3 public vizzes

Smilley Calm Face

This example shows a calm smilley face with yellow circular background, stylized eyes, eyebrows, and a mouth rendered as SVG shapes in a React application. The face is centered using a translated group, with each facial feature defined as a separate React component. The mouth uses the `arc` generator from `d3` to create a curved path. Components like `BackgroundCircle`, `Eyes`, `Eyebrows`, and `Mouth` receive numeric props that control positioning and sizing, all rendered through ReactDOM into an SVG viewBox.

Feb 26, 2020

Loading thumbnail…

Cars Report

This example displays a simple text-based report of cars priced under $2,000. The HTML page renders a large, pre-formatted message element, and the JavaScript imports car data and a formatting function. It filters the array, maps each car through `formatCar` to a readable string, and joins the results with newlines before assigning them to the page. The report is styled with an Ubuntu font and a dark background, using basic DOM manipulation rather than a charting library.

Dec 31, 2019

Loading thumbnail…

Cars Report

The visualization displays a simple "Hello World" message in large, centered text against a dark navy background. It imports car data from a static JSON array but does not render it, instead showing a fixed greeting. The example uses ES6 module imports, a plain HTML `<pre>` element for output, and CSS styling with the Ubuntu font from Google Fonts to demonstrate VizHub's basic setup.

Oct 30, 2019