David Emmanuel Katz

@dkatz23238·4 public vizzes

Topic Model Viz

This visualization displays a topic model’s data as a vertical column of small purple squares, with each square’s opacity reflecting the value in the second data column. It reads data from a remote CSV file via `d3.csv`, then renders the first 2,000 records as an SVG using `selectAll('rect')` and `insert('rect')`. Each rectangle is positioned 10 pixels apart, with fixed width and height of 8 pixels. The example uses D3 v5 and demonstrates a simple, minimal approach to encoding quantitative values through opacity.

May 5, 2021

Loading thumbnail…

Basketball Density Shot

This visualization displays the shot density and accuracy of LeBron James on a basketball court, using player shot data from the nba_api. Each shot is shown as a small circle, with green marks for made shots and red for misses, overlaid on a pixelated density grid. The grid’s color, using an interpolatePiYG palette driven by a d3.scalePow, indicates the ratio of misses to makes per cell. The court and its markings are drawn with React’s SVG components, while d3’s scaleLinear handles the coordinate mapping for both the player shots and the court geometry.

May 2, 2021

Loading thumbnail…

Fork of React Starter

This example shows a grid of 40 by 60 red squares arranged across an SVG canvas, with each square’s width and height varying according to the cosine of its row index, creating a wave-like pattern of alternating sizes. The code uses React to render the SVG elements, with ReactDOM mounting the App component into the page. D3’s `range` function generates the row and column coordinates, while custom `makeSquare` functions produce the rectangles. The visualization demonstrates how React and D3 can be combined to generate dynamic, data-driven SVG layouts.

May 2, 2021

Loading thumbnail…

Fork of QCEW - The Quarterly Census of Employment and Wages

This choropleth map displays total quarterly wages for restaurants across U.S. counties, using data from the QCEW for Q2 2020. Counties are colored with a d3.scaleOrdinal and schemeCategory10, with hover highlighting via CSS. The visualization uses d3.geoPath and geoAlbersUsa projection to render county boundaries from TopoJSON, while joining CSV wage data to geographic features. Tooltips show each county’s name and total wages.

May 1, 2021