arjun-lab663

@arjun-lab663·8 public vizzes

Histogram

This interactive histogram visualizes the distribution of one numeric variable using data loaded from a CSV file. Built with D3 v7, it renders bars as SVG rectangles, with the x-axis scaled linearly and the y-axis representing bin counts. The chart updates responsively on window resize, recalculating the histogram with 40 thresholds to accommodate the new width. Data is fetched from the `data_to_viz` GitHub repository.

Dec 26, 2021

Loading thumbnail…

Untitled

This example demonstrates a minimal React starter page that renders a static HTML document. It uses CSS for basic styling and JavaScript for dynamic behavior, though the visible output is a simple layout with a title and paragraph. The framework leverages React’s component-based structure, but currently shows no interactive visualizations or data-driven graphics. The code references a bare-bones HTML structure, with no external libraries like D3 or Three.js, focusing instead on foundational web technologies. It serves as a clean template for building more complex React applications.

Dec 7, 2021

Loading thumbnail…

aRJUN

This example presents a minimal web page built with React, rendered through a single HTML file. The page uses CSS for styling and JavaScript for interactivity, though the styles and script sections are currently empty, leaving the visualization undefined. The code references a React Starter template from VizHub, indicating the project structure relies on React’s component-based architecture. The visualization does not yet demonstrate any specific data or rendering technique, as the body contains no elements or imported libraries.

Nov 23, 2021

Loading thumbnail…

Fork of React Starter

This example renders a full-screen React message with a font size of 13em, centered via CSS. The app uses React 16.13.1 and ReactDOM to mount a single component into a `#root` div, though the component’s render function is currently empty in the provided source. The page loads React and ReactDOM from unpkg CDN and executes a bundled `bundle.js` file. The visualization demonstrates a minimal React setup with no data or interactive logic beyond static styling.

Jul 12, 2021

Loading thumbnail…

Fork of Fork of Fork of Stylized Bar Chart

This bar chart displays the top 10 most populous countries using data from the United Nations World Population Prospects 2019. The visualization uses d3.csv for data loading, d3.scaleBand for the categorical y-axis, and d3.scaleLinear for the numeric x-axis. Rendered as an SVG via React, each bar is a styled rectangle with a hover tooltip showing the population value. The axis labels use d3.format to abbreviate large numbers, converting 'G' values to 'B' for billions.

Jul 12, 2021

Loading thumbnail…

Fork of Fork of Stylized Bar Chart

This visualization displays the top 10 most populous countries as horizontal bars using React and D3 v5’s `scaleBand` and `scaleLinear`. It renders SVG rectangles for each country, with axes generated by custom `AxisBottom` and `AxisLeft` components. The data comes from the UN World Population Prospects 2019 CSV, loaded via D3’s `csv` function. Styling includes Poppins font and teal marks, with tooltips showing formatted population values.

Jul 12, 2021

Loading thumbnail…

Fork of Stylized Bar Chart

This bar chart displays the top 10 most populous countries from the United Nations World Population Prospects 2019 dataset. Using React and D3’s `scaleBand`, `scaleLinear`, and `format` APIs, the chart renders SVG rectangles via the `Marks` component, with axes generated by `AxisBottom` and `AxisLeft`. The code loads CSV data with `d3.csv`, formats population values in billions, and includes a hover tooltip via SVG `<title>` elements.

Jul 12, 2021

Loading thumbnail…

Fork of VizHub User Count Over Time

A line chart shows the cumulative number of VizHub users from August 2018 to July 2021, with circular markers at each data point. The chart uses D3 v4's `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` to build the axes and grid, while `d3.line` draws the path. Annotations via the `d3-svg-annotation` library highlight key events such as the VizHub 1.0 release, a Kickstarter campaign, and the launch of a Datavis 2020 course. The SVG renders the full chart and grid, with data loaded from `users.csv`.

Jul 12, 2021