neydareh

@neydareh·6 public vizzes

Bar Chart

A bar chart displays population counts for ten countries, using horizontal bars sorted by descending value with China and India leading. The visualization loads data from a CSV file, parses population figures, and renders SVG rectangles via D3 v5. It uses `d3.csv`, `scaleLinear` for the quantitative x-axis, `scaleBand` with padding for categorical y-axis placement, and configures `axisLeft` and `axisBottom` for ticks. Steelblue bars are drawn on a 960×500 canvas with explicit margins.

Nov 18, 2019

Loading thumbnail…

Bar Chart

This bar chart displays the population of the ten most populous countries, using horizontal bars ordered alphabetically from China to Mexico. The visualization is rendered in SVG using D3 v5, with `scaleLinear` mapping population values to bar widths and `scaleBand` handling the categorical country labels. Axes are generated via `axisLeft` and `axisBottom`, and the data comes from a local CSV file. The bars themselves are simple rectangles filled with steel blue.

Nov 18, 2019

Loading thumbnail…

Bar Chart

This bar chart displays the population of ten countries, ordered by size along a horizontal axis. The visualization uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to map quantitative values and categorical labels, rendering bars as SVG `rect` elements. Data is loaded from a CSV file via `d3.csv`, with population values converted from thousands to raw numbers. Margins define the plotting area, and axes are appended to a translated group element.

Nov 18, 2019

Loading thumbnail…

Bar Chart

This bar chart displays population estimates for the ten most populous countries, with each bar’s length proportional to the country’s population. The visualization uses D3 v5’s `scaleLinear` and `scaleBand` to map population values to bar widths and country names to vertical positions, rendering bars as SVG rectangles. Data is loaded from a CSV file, and populations are parsed and multiplied by 1000 before rendering. The chart includes fixed margins but no labels, leaving the bars to communicate the ranking.

Nov 18, 2019

Loading thumbnail…

Bar Chart

This example displays a static bar chart of population figures for ten countries, sourced from a CSV file containing country and population data. The chart is rendered as SVG elements within an HTML page, using the D3.js library (version 5) to load the data via the `csv` function and log it to the console. The visualization is generated through a simple script that imports `select` and `csv` from D3, though the current implementation does not yet draw the bars, only fetches and outputs the data. The SVG canvas is sized at 960 by 500 pixels, with the page styled by an external CSS file that removes margins and hides overflow.

Nov 18, 2019

Loading thumbnail…

Lets make a face

A face built from basic SVG shapes appears in the center of the canvas, with a yellow circle for the head, two dark eyes, and a semicircular mouth. The example demonstrates how to compose a figure using D3 v5’s `select` and `arc` APIs, positioning elements through translation and coordinates. The code calculates dimensions from the SVG attributes and places the face’s components relative to the viewport center, showing a simple approach to building custom visualizations with D3’s drawing utilities.

Nov 18, 2019