Activity-6 T-2

100%

Activity-6 T-2

✓ Published1🌍 Public

Last edited Oct 19, 2024

Created on Oct 19, 2024

This example demonstrates the basic setup for a VizHub project, showing how to combine D3.js with local ES6 modules. It loads D3 v5 via UNPKG and uses the `select` function from D3 to update the text content of a `div` element with the ID `message`. The text itself comes from a separate `myMessage.js` module, which exports a string via `export const`. The page also includes simple CSS styling for centering and sizing the message text.

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…

Activity_6

This example demonstrates basic VizHub project structure with modular ES6 imports and D3.js integration. It renders a simple text message centered on the page using D3’s `select` function to target a div element and set its content. The code imports `select` from the D3 library via UNPKG, imports a string from a local `myMessage.js` module, and applies styling through an external CSS file. The example highlights how to combine CDN-loaded libraries, local modules, and styles in an HTML document.

Vvarshithainaganti@gmail.com

92% match

Loading thumbnail…

Activity 6

This example demonstrates the basic workflow of a VizHub project, showing how a web page can be assembled using D3.js and local ES6 modules. It presents a simple message, "Hello VizHub!", centered on the screen with large text styling. The code loads D3 v5 via UNPKG and uses the `select` API from D3 to target the `#message` div, setting its content from an imported `message` variable defined in a separate `myMessage.js` file. The example also includes a regular expression and a local CSS file for styling.

Ppravallikachowdary16518@gmail.com

91% match

Loading thumbnail…

Activity-6_task_1

This example demonstrates how to import D3.js and local ES6 modules within a VizHub project. It uses D3’s `select` function to set the text content of a `#message` div, displaying “Hello VizHub!”. The page loads D3 v5 from UNPKG via a script tag in `index.html`, while `index.js` pulls in `select` from the `d3` package and a custom `message` constant from `myMessage.js`. Styling is applied through an external CSS file, showing a minimal modular setup.

HHarinathChakali33@gmail.com

91% match

Loading thumbnail…

Activity-6Tutorial-3

This example demonstrates a minimal VizHub project that renders a centered “Hello VizHub!” message using D3.js. It shows how to load D3 v5 from UNPKG, import the `select` function from the `d3` module, and use a local ES6 module (`myMessage.js`) to supply the text content. The code sets the text of a `div` element via `select('#message').text(message)`, with styling applied through an external CSS file. No data source is used; the visualization is purely text-based.

Gganeshrajuparmalla@my.unt.edu

91% match

Loading thumbnail…

Activity 6

This example demonstrates how to set up a minimal VizHub project with D3.js, displaying the text "Hello VizHub!" centered on the page. The code imports the `select` function from D3 via UNPKG and a local ES6 module exporting a message string. It uses `select('#message').text(message)` to update the DOM, with styling applied through an external CSS file for large centered typography. The project illustrates basic module imports, D3 selection, and CSS integration in a single-page setup.

Yyellahemalatha@gmail.com

90% match

Loading thumbnail…

Activity-6

This example demonstrates how VizHub loads D3 via UNPKG and renders a simple text message to the screen using D3's `select` method. The code imports a local ES6 module from `myMessage.js` and sets the text content of an HTML `<div>` element. It also imports API functions from D3 using ES6 `import` syntax. The visualization primarily shows basic module importing and DOM manipulation rather than data-driven graphics.

SSreeKohaliPatel@my.unt.edu

90% match

Loading thumbnail…

Activity6

This example demonstrates the basic setup of a VizHub project, displaying a simple "Hello VizHub!" message in the center of the page using D3 v5. It imports the `select` function from D3 via UNPKG and a local ES6 module that exports the message string. The rendering approach uses `select('#message').text(message)` to set the div’s content, with styling applied via a linked CSS file.

BBibek Lamsal

90% match

Loading thumbnail…

Activity 6

This visualization demonstrates how to set up a simple D3.js project within the VizHub environment. The example shows a basic web page that displays a large "Hello VizHub!" message using D3's `select` function to target the `#message` div. It illustrates importing both the D3 library via UNPKG and local ES6 modules, with the text content defined in `myMessage.js`. The code also includes CSS styling to center the text with a large font size.

Ppraneeth.d555@gmail.com

90% match