Dhiraj Gede

@dhiraj-gede·3 public vizzes

Fork of Vega-Lite API Template

This example visualizes the relationship between the added and published dates of UCI Machine Learning Repository Auto MPG data records, using a Vega-Lite area mark to show temporal distribution. The code constructs the chart via the `vega-lite-api` library, which registers with `vega`, `vega-lite`, and `vega-tooltip` for interactive tooltips. Data is loaded asynchronously with `d3.json`, and the visualization renders as an SVG, with custom styling applied through a configuration object that adjusts axis and label appearance for readability.

Jan 7, 2022

Loading thumbnail…

Fork of Loading and Parsing CSV Data

This example demonstrates how to load and parse CSV data by displaying the file size, row count, and column count of a CSS Named Colors dataset pulled from a GitHub gist. It uses the D3 v5 `d3.csv()` method to fetch and parse the data asynchronously, then formats the summary with `d3.csvFormat()` and updates the page via `document.getElementById()`. Commented-out alternatives show equivalent approaches using the Fetch API with `fetch()` and `response.text()`, alongside `d3.csvParse()` and `async`/`await` syntax.

Jan 7, 2022

Loading thumbnail…

Fork of Hello HTML

A grid of 15 cartoon faces, each rendered as a yellow circle with black outlines, eyes, and a mouth, uses randomly generated parameters to vary stroke width, eye offset, eye radius, mouth width, and mouth radius. Built with React and D3 v7, the visualization composes SVG elements via custom components like `FaceContainer` and `Mouth`, which leverages `d3.arc` to generate the mouth path. The faces are positioned through a single `Face` component instantiated in a loop with D3’s `range`.

Jan 7, 2022