martiguesc

@martiguesc·3 public vizzes

Hello VizHub

This example demonstrates a minimal D3.js setup that renders a static text message on a web page. It uses D3 v5’s `select` method to target a `<div>` element and set its content, with the message itself imported from a separate ES6 module. The page’s styling is defined in an external CSS file, which imports a Google Font and applies a dark background with large, centered text. No data or interactive behavior is involved; the visualization simply shows how VizHub structures files and dependencies for a basic D3 project.

Oct 13, 2019

Loading thumbnail…

Cars Report

This visualization, titled “Cars Report,” displays a dataset of cars using a force-directed network layout. It renders nodes representing cars, with connections between them arranged through a physical simulation. The implementation uses D3 v5’s `d3.forceSimulation` to position elements and manage collision and link forces, while the node and edge visuals are drawn as SVG elements. The code loads data dynamically and updates the simulation as the graph evolves, providing an interactive overview of relationships within the car dataset.

Oct 13, 2019

Loading thumbnail…

Cars Report

This example displays a single car make from a small static dataset of four vehicles. The code imports car data from a JSON array via an ES6 module and uses `document.getElementById` to update the text content of a `<pre>` element. The page applies a custom Ubuntu font and bold styling through CSS, and the bundled script runs in the browser from `bundle.js`. The visualization shows only the first car’s make, "Honda," without any charts or interactive elements.

Oct 11, 2019