Fork of Hello VizHub

100%

Fork of Hello VizHub

✓ Published0🌍 Public

Last edited Nov 11, 2022

Created on Nov 11, 2022

This example demonstrates how VizHub supports ES6 module imports and external library loading to render a simple static message. It uses D3 v5, imported via UNPKG from a CDN, to select the `#message` div and set its text. The text content comes from a local ES6 module, `myMessage.js`, which exports the string "Hello VizHub!". The page is styled with a CSS file, centering the message at a large font size.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Hello VizHub

This example demonstrates how VizHub supports ES6 modules and external libraries by rendering a centered “Hello VizHub!” message. It imports the `select` function from D3 v5 (loaded via UNPKG) to manipulate the DOM, and imports a local `message` string from a separate `myMessage.js` module. The message is displayed in a large, centered font using CSS. The code shows the basic setup for combining CDN-loaded D3 with modular JavaScript in a VizHub project.

NNithin Gopalakrishnan

95% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates how VizHub loads D3 from a CDN and uses ES6 modules to display a simple text message. It shows the basic setup of an HTML page with D3 v5, where the `select` function targets the `#message` div and sets its text content. The message string is imported from a local `myMessage.js` module, and the layout is styled with centered, large font text via `styles.css`.

Ttingfangcheng

94% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates how to load D3 via UNPKG and use ES6 modules in a VizHub project. It uses the `select` function from D3 to target a `#message` div and set its text content. The text string comes from a local module, `myMessage.js`, which exports a `message` constant. The final page renders a centered, large-font "Hello VizHub!" message using CSS from `styles.css`, showcasing basic module imports and DOM manipulation.

DDivyaVellanki

94% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates how D3 and ES6 modules can be used to build a simple VizHub visualization. It loads D3 v5 from a CDN and uses `import { select } from 'd3'` to select the `#message` div and set its text. A separate local module, `myMessage.js`, exports the string 'Hello VizHub!' via `export const message`, which is then displayed. The page also includes a CSS file for styling the large centered text.

NNohaS

93% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates the modular structure of a VizHub project, showing how D3.js and local ES6 modules work together to render a simple text message. It uses D3 v5 loaded via UNPKG, with the `select` function from D3 to target the `#message` div and set its text content. The message itself comes from a separate local module, `myMessage.js`, which exports the string "Hello VizHub!". Styling is handled by CSS, centering the text at a large font size.

Aatang148

93% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates VizHub’s ability to combine ES6 modules with D3.js by rendering a simple “Hello VizHub!” message. It shows how to import both external libraries and local code, using `select` from D3 to target a `div#message` and setting its text via a custom `message` export from `myMessage.js`. The page loads styles from `styles.css` and D3 v5 from UNPKG, bundling everything into `bundle.js`.

CCHIJIOKE-UKWU PROMISE

93% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates how VizHub supports integrating D3.js with ES6 modules, displaying a simple “Hello VizHub!” message in a styled div. It loads D3 v5 from UNPKG and uses the `select` API to update the text content of an HTML element. The code also showcases importing local modules, such as `myMessage.js`, and includes CSS styling for centered, large text. The example serves as a minimal template for combining D3, modular JavaScript, and external libraries in a browser environment.

PPofii807

93% match

Loading thumbnail…

Fork of Hello VizHub

This example demonstrates how VizHub projects can load D3 and organize code with local ES6 modules. It uses D3’s `select` function to target a `div` with the id `message` and set its text content to a string imported from a separate module. The imported `message` constant is defined in `myMessage.js`. The page includes D3 v5 via UNPKG, and the stylesheet centers the message with a large font size.

Ffrozengem397

93% match