sofigg

@sofigg·4 public vizzes

Fork of data_plaisio2

This example plots items from a CSV dataset of Plaisio products, showing the relationship between hard drive capacity and RAM. Each circle represents a product, positioned by these two attributes and colored by price, with the product name available as a tooltip. The visualization is built using the Vega-Lite API and rendered through Vega, with D3.js handling the CSV data loading from a remote gist. The code customizes the axis appearance and tooltip styling through a configuration object.

May 30, 2022

Loading thumbnail…

data_plaisio

This visualization maps the relationship between hard drive capacity and RAM for products listed in a CSV dataset from Plaisio, with price encoded by color and product names shown via tooltips. Built with the Vega-Lite API and D3, it renders circles as marks, scaling both axes from zero and adjusting sizing and opacity for readability. The code sets dark-themed axis styling and uses vega-tooltip for interactive hover details.

May 30, 2022

Loading thumbnail…

Fork of Customizing Axes

This bar chart displays total COVID-19 vaccinations for 16 European countries, using data from a CSV file. The visualization demonstrates custom axis styling with D3 v5, including a horizontal grid, formatted tick labels that convert G to B for billions, and a custom title and axis label. It uses `d3.scaleLinear`, `d3.scaleBand`, `d3.axisBottom`, and `d3.axisLeft` to render the SVG chart, with bars colored via CSS.

May 24, 2022

Loading thumbnail…

visualization project3

A scatterplot maps COVID-19 vaccination totals by location and vaccine manufacturer, with circle size and opacity encoding total vaccinations and color distinguishing categories. Built with the vega-lite-api, it registers Vega-Lite and vega-tooltip, loads CSV data from a GitHub gist via d3.csv, and applies a custom config for axis styling and font sizes. The visualization renders responsively to the full window using SVG output.

May 24, 2022