Nanok09

@Nanok09·4 public vizzes

Bar Chart

This example displays a horizontal bar chart ranking countries by population, using a CSV dataset of ten nations. The visualization is built with D3.js v5, using `scaleLinear` and `scaleBand` to map population values and country names to SVG rectangles. The axes are generated with `axisLeft` and `axisBottom`, and the bars are rendered as SVG `rect` elements. Data is loaded via `d3.csv` and converted from raw values to thousands.

Feb 3, 2020

Loading thumbnail…

truc

This example presents a simple SVG canvas and loads a CSV dataset using D3’s `csv` function, parsing each row’s `population` field into a number before logging the resulting array to the console. The visualization does not yet render any marks or interactions; it only demonstrates the initial data-loading and preparation step within a React-based ES6 project. All code runs against the D3 `select` and `csv` APIs, with the SVG dimensions read from the markup’s attributes.

Feb 3, 2020

Loading thumbnail…

HTML Starter

This example demonstrates the simplest possible setup for a visualization with React, rendering the text “Hello World” to the page. It uses a plain HTML file with a `<pre>` element and a separate JavaScript file. The `index.js` file selects that element using `document.getElementById` and sets its `textContent` property to the message. The project includes a `bundle.js` script, indicating a build step, and serves as a minimal starting point for more complex React-based visualizations.

Feb 3, 2020

Loading thumbnail…

HTML Starter

This example displays the text “Hello HTML” centered on a plain white page, rendered at an extremely large font size using a CSS style block that sets the body’s text alignment and font size to 13em. It serves as a minimal, bare-bones HTML page, containing no external libraries or JavaScript. The entire visualization is produced through simple HTML markup and inline CSS styling, with the page’s title set to “HTML Starter” in the browser tab.

Feb 3, 2020