Skip to main content
SimilarExport ZIP
100%

JSImports

✓ Published0🌍 Public
PPatrick-Houlihan
Last edited Mar 5, 2022
Created on Mar 5, 2022
Forked from Hello VizHub

This example demonstrates how VizHub projects can load D3 from a CDN, import API functions from the D3 module, and use local ES6 modules for custom code. It displays the text "Hello VizHub!" in a centered message div using `select('#message').text()`. The project also defines a `Rectangle` class with a static asynchronous `load` method that logs to the console, and a separate `myMessage.js` module exporting the displayed string. The page uses minimal styling from `styles.css` with 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…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
90% match
Loading thumbnail…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
90% match
Loading thumbnail…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
90% match
Loading thumbnail…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
90% match
Loading thumbnail…

Project

This example demonstrates loading D3 from a CDN and using ES6 module imports to render a centered “Hello VizHub!” message. It imports the `select` function from D3 to set the text of a `div` element, and imports a `message` constant from a local module. The page includes a CSS file for styling the text and relies on D3 v5 loaded via UNPKG, with a bundled JavaScript file executing the imports.

Ppslharika@gmail.com
90% match
Loading thumbnail…

Activity 7.1

This example demonstrates how to build a simple VizHub project by loading D3 v5 from a CDN and importing local ES6 modules. It displays the text “Hello VizHub!” centered in a large font using the `d3.select` API to set the content of an HTML div element. The code uses `import { select } from 'd3'` and a custom module `myMessage.js` to export the message string, showing basic module composition. The page is styled with a CSS file that centers the message and sets its font size. The visualization is minimal, focusing on tooling and module patterns rather than data rendering.

Bbhavanadupati3@gmail.com
88% match
Loading thumbnail…

Hello VizHub

This example demonstrates the fundamental workflow of a VizHub project: using D3.js to manipulate the DOM and ES6 modules to organize code. The page displays a large, centered "Hello VizHub!" message in a custom Ubuntu font against a dark navy background. The `index.js` file imports the `select` function from D3’s v5 API and a local string from `myMessage.js`, then calls `select('#message').text()` to inject that message into the designated div. The styling relies on an external Google Fonts stylesheet imported via CSS.

Jjiaweixu
87% match
Loading thumbnail…

Hello VizHub

This example demonstrates how to set up a minimal VizHub project that loads D3.js via UNPKG and uses ES6 modules. It shows D3’s `select` function targeting a div with the ID `message` to update its text content, while a local module exports the string being displayed. The page renders static text through a combination of external library imports and a local `myMessage.js` file, with CSS centering the large-font output.

Ssyedkabir268
87% match