lemonyunyun

@lemonyunyun·4 public vizzes

making a bar chart

This example shows annual snowfall totals from 1999 to 2018 using a simple bar chart built with D3 v5. It renders SVG rectangles that are appended to the chart, with each bar’s width fixed at 300 pixels, though the height is not yet encoded from the data values. The visualization relies on `d3.select` and `d3.csv` to load the dataset, and the code converts the snowfall field to numbers before logging the parsed data to the console. The chart is styled with a full-viewport SVG and minimal CSS.

Jun 25, 2019

Loading thumbnail…

Mysterious VizHub Error Debug Helper

This example shows a debugging visualization for a VizHub project, displaying snowfall data from a CSV file as oversized, overlapping 300px squares on a 960×500 SVG canvas. The code uses d3.csv to load the dataset, parses the year and snowfall columns, and binds the data to svg rect elements. Only the rectangle width and height are set, with no positioning or scaling, so all bars render stacked on top of each other in the top-left corner, demonstrating a common D3 layout error.

Jun 25, 2019

Loading thumbnail…

Mysterious VizHub Error Debug Helper

This example presents a simple SVG-based bar chart visualization of population data from a CSV file. The code uses D3 v5 with `select` and `csv` functions to load and parse the data, then attempts to process each record. However, the script contains an incomplete data transformation with a syntax error (`d.populaltion)`), causing it to fail before rendering any chart. The visualization is intended to display yearly population values on an SVG canvas measuring 960 by 500 pixels, but the error prevents the data from being visualized.

Jun 25, 2019

Loading thumbnail…

Mysterious VizHub Error Debug Helper

This example demonstrates a minimal SVG visualization scaffold that renders an empty chart area using D3 v5. The code imports core D3 modules including `select`, `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`, then initializes an SVG canvas with fixed dimensions. A `render` function is defined but contains commented-out attempts at creating color scales, band scales, and SVG rectangles, with the actual rendering logic disabled. The visualization only calls `render` with an array of three numbers, resulting in no visible output on the page.

Jun 25, 2019