das888530

@das888530·9 public vizzes

Fork of Fork of Covid-19

This visualization displays a global map of cumulative COVID-19 cases on March 25, 2020, with orange circles sized by the square-root of case counts. Static by default, it includes a date slider that currently does not update the visualization. It loads world country boundaries via TopoJSON and renders them with `d3.geoPath` using a Mercator projection, while plotting case data from a CSV file. The implementation uses `d3.csv`, `d3.scaleSqrt`, `d3.scaleOrdinal`, and `d3.timeParse` to process and encode the data.

Jun 22, 2021

Loading thumbnail…

Fork of Covid-19

A world map uses semitransparent orange circles to show cumulative COVID-19 case counts by country on March 25, 2020. The visualization renders country boundaries as SVG paths via `d3.geoPath` with a `geoMercator` projection, and scales circle radii with `d3.scaleSqrt`. Data comes from a CSV of Johns Hopkins case counts, loaded with `d3.csv`. A range slider is present, but it does not currently change the displayed date.

Jun 22, 2021

Loading thumbnail…

Fork of Testing D3 force layout

This example shows a force-directed network graph of nodes and links, displaying a dataset of photograph-related entities and their connections. The visualization loads graph data from a JSON file and uses D3 v3’s force layout to position the elements dynamically. Nodes are rendered as SVG groups containing a GitHub favicon image and a text label, while links appear as simple gray lines. The simulation applies gravity, charge, and link distance settings to arrange the layout, and node positions update on each tick event.

Jun 22, 2021

Loading thumbnail…

Fork of Network

This visualization displays a character interaction network from Les Misérables, with nodes colored by group affiliation (Document, Email, Person, Location, Organization, Email Address). The SVG rendering uses d3.forceSimulation with link, charge, and center forces to position interconnected characters. Node colors derive from a d3.scaleOrdinal with schemeCategory10, while a colorLegend component shows the category mapping.

Jun 20, 2021

Loading thumbnail…

Fork of Force Network

This force-directed network graph visualizes relationships between actors, directors, and films using data from a JSON file. Nodes are color-coded by group type (actors, directors, films), with links representing connections like "Acted in" or "Directed." The visualization uses `d3.forceSimulation` with forces for links, charge, collision, and centering, rendered as SVG with draggable nodes and hover highlighting. Arrow markers denote link direction, while the simulation updates node and link positions on each tick.

Jun 20, 2021

Loading thumbnail…

Fork of COVID-19 Deaths in US (NYT data) Reusable D3 Scatter Plot Framework

This scatter plot visualizes COVID-19 daily average deaths in the United States over time, using data from the New York Times rolling averages dataset. A single blue circle per date is rendered as an SVG path using d3.scaleTime, d3.scaleLinear, and d3.extent. The chart includes dual time axes for months and years, custom text labels, and a red annotation marking a vaccination threshold. The reusable framework is built with a closure-based d3 factory function that exposes chainable setter methods for configuration.

Jun 18, 2021

Loading thumbnail…

Fork of Points on a Map

This example displays a world map with cities having populations over 50,000, plotted as semi-transparent teal circles. It uses a natural Earth projection via `geoNaturalEarth1` and renders both graticules and country interiors with `geoPath`. The map is built with React, loading geographic data from World Atlas TopoJSON and city coordinates from a Simplemaps CSV. City positions are projected using `[d.lng, d.lat]` to determine circle placement within an SVG.

Jun 18, 2021

Loading thumbnail…

Fork of Fork of HTML Starter

This example displays the text “Hello HTML” at a massive 13-em font size, centered on the page. It uses plain HTML and CSS for styling, with a small JavaScript script that declares React and ReactDom imports, though the code does not demonstrate any interactive behavior or complex rendering. The page also includes an empty SVG element with a width of 960 pixels, which is not populated with any graphical content. The project serves as a minimal starter template for combining HTML, CSS, JavaScript, and React in a single file.

Jun 17, 2021

Loading thumbnail…

Fork of HTML Starter

This example demonstrates a minimal HTML page that prints the text "Hello HTML" at a massive 13em font size, centered in the browser window. The page includes a CSS style block for body text alignment and sizing, and a JavaScript script tag that logs "Hello JavaScript!" to the browser console. It uses vanilla HTML, CSS, and JavaScript without external libraries or data sources. The page serves as a bare-bones template for understanding how these three technologies work together in a single file.

Jun 17, 2021