Harsh kumar

@kumar8801·4 public vizzes

Untitled

This example shows a bar chart of the top 10 most populous countries, using data from the United Nations World Population Prospects 2019. The React-based visualization uses d3.v7 with SVG rendering, employing `scaleBand` for the y-axis and `scaleLinear` for the x-axis. The `Marks` component renders each bar as a `rect`, with tooltips providing exact population values via the `title` element. Axis components handle tick formatting and labels, while the `useData` hook asynchronously loads the CSV dataset with d3.csv.

Jul 1, 2022

Loading thumbnail…

Fork of Stylized Scatter Plot

This scatter plot visualizes the palmerpenguins dataset, showing the relationship between bill length and bill depth. The visualization uses React with D3 scales (`scaleLinear`) and SVG rendering, with custom `AxisBottom` and `AxisLeft` components generating tick marks and labels. Data is loaded asynchronously via D3’s `csv` parser and mapped to numeric values before being plotted as circles with tooltip titles. Styling includes a Poppins font, teal marks, and gray axis lines, with axis labels rotated for clarity.

Jul 1, 2022

Loading thumbnail…

Fork of Stylized Scatter Plot

A scatter plot of the Iris Dataset shows petal length on the x-axis against sepal width on the y-axis, with each point representing a flower. The visualization uses React components to render SVG circles, axes, and labels, with scales and data loading handled by d3-scale and d3-fetch. Styling includes Poppins typography, teal marks, and tick formatting via d3-format. The example demonstrates a clean, modular React-D3 integration, loading data from a CSV and displaying it through reusable axis and mark components.

Jul 1, 2022

Loading thumbnail…

Fork of HTML Starter

This example displays a large, centered "Hello HTML!" message using plain CSS styling and JavaScript. The code sets width and height variables and defines a small array of temperature and sales data, though this data is not used for any visualization. It demonstrates a minimal HTML page structure combining inline styles, a styled div element, and a script tag with sample data. The example uses standard HTML, CSS, and JavaScript without external libraries or rendering APIs.

Jul 1, 2022