Skip to main content
Log in
G

gfesquivelt

@gfesquivelt·5 public vizzes

Loading thumbnail…

Hello VizHub

This example demonstrates a minimal "Hello World" visualization, displaying the message in large, centered, light-colored text against a dark blue background using the Ubuntu font. It shows how VizHub projects are structured by importing an ES6 module and using a message variable. The rendering is handled through standard HTML and CSS, with the message written to the DOM via JavaScript, and D3 is loaded but not explicitly utilized. The project relies on a simple `index.js` file to set the message variable.

Jul 6, 2019
Loading thumbnail…

Hello VizHub

This example uses D3 v5 to display the text “Hello VizHub!” in the center of a dark blue page with large, light-colored Ubuntu font. The code imports the `select` function from D3 and an ES6 module from a local file to set the message content. The page structure is defined in HTML, with styling provided by CSS that imports the Ubuntu typeface from Google Fonts. The visualization demonstrates basic D3 DOM manipulation and module-based code organization within a VizHub project.

Jul 6, 2019
Loading thumbnail…

Hello VizHub

This example demonstrates how to display a static text message using D3.js version 5. It shows the basic structure of a VizHub project, including an HTML page, a JavaScript module, and CSS styling. The code uses D3’s `select` function to target the `#message` div and set its text content from an imported ES6 module. The styling applies a large Ubuntu font with a dark blue background, while the message itself is defined as the exported constant `message` in `myMessage.js`.

Jul 6, 2019
Loading thumbnail…

Hello VizHub

This example displays a single static text message, “Hello VizHub!,” centered on a dark blue background using the Ubuntu font. It demonstrates fundamental VizHub workflow patterns: an HTML page loads D3 v5 and a bundled JavaScript file, while the main script imports the `select` function from D3 and a message constant from a local ES6 module. The code then sets the text content of a `div` element with the ID `message`, relying on CSS for styling and the `@import` rule for external fonts.

Jul 6, 2019
Loading thumbnail…

Hello VizHub

This example uses D3 v5 to display the text “Hello VizHub!” in the center of a dark blue page with large, light-colored Ubuntu font. The code imports the `select` function from D3 and an ES6 module from a local file to set the message content. The page structure is defined in HTML, with styling provided by CSS that imports the Ubuntu typeface from Google Fonts. The visualization demonstrates basic D3 DOM manipulation and module-based code organization within a VizHub project.

Jul 6, 2019