Niall O'Brien

@KnownAsNob·6 public vizzes

Disapathes 2018

This bar chart displays the number of emergency dispatches at Dublin Fire Brigade stations during 2018, with station names on the vertical axis and dispatch counts on the horizontal axis. The visualization uses D3 v5’s `scaleBand` and `scaleLinear` to position bars, `axisLeft` and `axisBottom` for labeled ticks, and SVG rectangles styled in steel blue. Data is loaded from a CSV file, with margins and a formatted tick label using D3’s `format`.

Dec 15, 2019

Loading thumbnail…

DF Dispatches 2018

The visualization shows the number of Dublin Fire Brigade dispatches per month in 2018, plotted as a line chart with month on the x-axis and call volume on the y-axis. The data reveals a spike in July and October, with relatively lower counts in February. The chart is rendered as an SVG using D3 v5, with `d3.scaleLinear` for both axes, `d3.line` with `curveLinear` for the path, and `d3.axisLeft` and `d3.axisBottom` for ticks. Data is loaded from a CSV file using `d3.csv`.

Dec 15, 2019

Loading thumbnail…

DF Dispatches 2018

This line chart displays the number of Dublin Fire Brigade dispatches for each month in 2018, highlighting the variation in call volume across the year. The visualization uses d3.csv to load the dataset and renders an SVG with d3.scaleLinear for both axes, d3.axisLeft and d3.axisBottom for tick marks, and d3.line with curveLinear to connect the data points. The chart applies a custom margin, axis labels, and a title, with grid lines styled via CSS.

Dec 15, 2019

Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays one week of temperature data for multiple cities around the world, sourced from Data Canvas - Sense Your City. The visualization uses D3 v5 to render an SVG with a time-based x-axis and linear y-axis. Cities are color-coded via the `scaleOrdinal` and `schemeCategory10` APIs, with a custom legend built from `colorLegend`. The `nest` function groups data by city, while `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` generate the smoothed paths.

Nov 27, 2019

Loading thumbnail…

Temperature in San Francisco: line charts

This line chart shows the evolution of temperature in San Francisco over time, with time on the x-axis and temperature on the y-axis. The visualization uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisLeft`, `axisBottom`, and `line` with `curveBasis` to create a smooth curve. SVG rendering is used with custom styling for grid lines and labels. The data is loaded as CSV from an external dataset and parsed into timestamp and temperature values before being plotted.

Nov 27, 2019

Loading thumbnail…

Hello VizHub

This example greets the user with a large, centered "Hello VizHub!" message on a deep blue background, using the Ubuntu typeface. It imports the `select` function from the D3.js v5 library and an ES6 module `myMessage.js` that exports the displayed string. The page structure comes from `index.html` with a `message` div, styled by `styles.css`, and labeled with a 12em font size.

Nov 26, 2019