Dimitra Mazaraki

@mazaraki·3 public vizzes

Cars Reports

This example displays the make of the first car in a hardcoded JSON array, referenced from a separate cars module and rendered as plain text inside a `<pre>` element. The data, which includes fields like year, make, model, and price, is defined directly in the JavaScript source as a string and then converted using `JSON.parse`. The page links to an external stylesheet for Ubuntu font styling and relies on ES6 module imports to load the car data. The visualization itself does not include charts or graphical output.

Sep 27, 2019

Loading thumbnail…

Cars Report

This example displays a simple dynamic message—initially “Hello World!”—on a dark webpage. It demonstrates a minimal D3.js setup, loading the d3 library and using JavaScript to inject text into an HTML element. The code imports a message from a separate ES6 module, `myMessage.js`, and assigns it using `document.getElementById`, though the page initially renders the hardcoded string. The visualization highlights basic DOM manipulation and modular JavaScript organization within a single-page report format.

Sep 27, 2019

Loading thumbnail…

Hello VizHub

This example displays a large, centered "Hello VizHub!" message in white Ubuntu type against a dark navy background, demonstrating a minimal end-to-end VizHub project. It uses D3.js version 5’s `select` function to target the `#message` div and set its text content from an imported ES6 module, `myMessage.js`. The styling relies on a Google Fonts import and basic CSS properties, while the HTML structure links the external stylesheet and script bundle.

Sep 25, 2019