Esdras08

@Esdras08·7 public vizzes

Stacked bar chart v4

Stacked bars display the relative mineral composition (moisture, nitrogen, phosphorus, potassium) of 67 plant samples from a TSV dataset. Each bar represents a plant, with segments colored by nutrient using `d3.scaleOrdinal`. The chart uses `d3.scaleBand` for the x-axis and `d3.scaleLinear` with `.nice()` for the y-axis, rendering SVG rectangles via stacked groups. The code applies `d3.stack().keys()` to compute stack positions and hides axis domains with CSS.

Feb 16, 2018

Loading thumbnail…

Barchart (nutriments)

This bar chart displays the average nitrogen content (AvN) of various crops, sorted by their names, with each plant represented as a blue-outlined rectangle. The visualization uses D3 v4 with SVG rendering, employing `d3.tsv` to load nutrient data from a tab-separated file and `d3.scaleLinear` to map nitrogen values to bar heights. The chart is set against a gold background, and bars are positioned horizontally with a fixed width and vertical spacing based on their index in the dataset.

Feb 16, 2018

Loading thumbnail…

Barchart (nutriments)

This example shows a bar chart of nutrient data for various crops. Each rectangle’s height encodes the value of the AvN field (nitrogen) from a TSV dataset of plant nutrient measurements, with the bars positioned along the x-axis by row index. The chart is rendered as SVG using D3 v4, with blue-outlined rectangles on a gold background. Though axes and labels are not implemented, the chart effectively communicates relative differences in nitrogen content across the listed crops, such as broccoli and lettuce showing higher values than tomato or papaya. The visualization is minimal, using a fixed scale from 0 to 67 (scaled to a height of 100) and colored gold background to emphasize the bar strokes.

Feb 16, 2018

Loading thumbnail…

Barchart (nutriments)

This bar chart visualizes the nitrogen content (AvN) of various plant species from a TSV dataset, with each bar representing a different crop or forage. The visualization displays the data as a series of thin, blue-stroked rectangles arranged horizontally, with bar heights proportional to nitrogen values. The implementation uses D3 v4 with `d3.select` and `d3.tsv` to load the tab-separated data, `d3.scaleLinear` to map the nitrogen values to pixel heights, and dynamically appends SVG `rect` elements to the chart. The chart is rendered on a black background with each bar positioned along the x-axis at regular intervals.

Feb 16, 2018

Loading thumbnail…

Barchart (nutriments)

This example shows a horizontal bar chart of nitrogen content (AvN) in various crops, using D3 v4 with SVG rendering. The data, loaded from a tab-separated file, is displayed as blue-outlined rectangles, each bar positioned along the x-axis at intervals of 11 pixels and scaled vertically with a linear scale from 0 to 67. The chart is rendered on a black background with multi-colored paragraph text, though the bars themselves are drawn with a simple blue stroke. The visualization focuses on comparing average nitrogen values across different plant species, with bar heights proportional to the AvN field. The bars are placed at y = 200 - 10 * y(d.AvN), suggesting an attempt to map data values to bar heights, though the y-scale is not explicitly tied to the SVG height. The visualization does not include axes, labels, or a legend, and appears to be a basic, unpolished bar chart example.

Feb 16, 2018

Loading thumbnail…

Barchart (nutriments)

This bar chart visualizes nitrogen content (AvN) across different plant species, using data loaded from an external TSV file. Each bar represents a crop, with height proportional to its average nitrogen value. The chart is rendered as SVG rectangles, positioned horizontally with a fixed width, scaled using a linear scale from 0 to 67 (the maximum AvN value). Blue-outlined bars are plotted against a y-axis that maps nitrogen values to pixel heights, with bars placed at regular intervals. The visualization highlights variations in nitrogen concentrations among vegetables, forages, and fruits, sorted by the order in the source dataset. A small circular logo appears in the corner, but the chart itself lacks axes and labels, making it a raw, preliminary exploration of the data.

Feb 16, 2018

Loading thumbnail…

Gist bfcd7300bf6652dd21c66bcd2c850bfe

A choropleth map of France displays the total annual flu cases per region for 2014, sourced from the `GrippeFrance2014.csv` file. The map uses a color scale ranging from 0 to 2000 to encode each region's cumulative count from the `somme2014` column. The visualization is built with D3 v4, utilizing `d3.geoPath` with a conic conformal projection to render the regional boundaries from the `regions.json` TopoJSON data, and then joins the CSV values to fill each polygon.

Feb 2, 2018