deepshikathakur111@gmail.com

@deepshika111·11 public vizzes

ice-9

A multi-page Vue dashboard presents workout data through scatter plots, stacked bar charts, and line charts. The visualizations explore workout duration, calories burned, and intensity levels. Charts are embedded as static PNG images generated with Python and Matplotlib, while the interface uses HTML, CSS, and JavaScript to structure navigation between pages. The layout includes descriptive text accompanying each chart to explain the data encodings used.

Apr 20, 2026

Loading thumbnail…

Fork of Fork of ICE_8_Q2_Network

This interactive network visualization maps conceptual relationships between technology skills, with color-coded nodes grouped by category and labeled with skill names. Built with D3.js v7 and React, the force-directed layout uses `d3.forceSimulation` with link, many-body charge, center, and collision forces to position nodes. Users can drag nodes to reposition them, with the simulation responding in real time. The SVG rendering displays circles and text labels, with links drawn as gray lines. Data is hard-coded in the script, representing a small set of skills and their connections.

Apr 12, 2026

Loading thumbnail…

Fork of Fork of ICE_8_Q2_Network

This visualization shows a hierarchical technology learning tree with top-level fields like AI, Web Development, and Cybersecurity branching into specific skills such as Python, React, and Linux. The code uses `d3.hierarchy` and the `d3.tree()` layout to position nodes, with `d3.linkHorizontal` drawing curved links between them. Node circles are colored by depth using conditional fills, and labels are rendered as SVG text. The static dataset is defined inline in JavaScript, and the entire diagram is rendered as SVG within a React-agnostic HTML page.

Apr 12, 2026

Loading thumbnail…

Fork of ICE_8_Q2

This example shows a technology learning tree with a root “Tech” node branching into three skill categories—AI, Web Development, and Cybersecurity—each with three leaf skills. It renders a hierarchical tree using the d3.hierarchy and d3.tree layout APIs, drawing links with d3.linkHorizontal and color-coding circles by depth. The SVG is built with D3 v7 and styled with inline attributes, displaying all data from a hardcoded JavaScript object.

Apr 12, 2026

Loading thumbnail…

ICE_8

This example displays a world choropleth map, coloring each country according to randomly generated sample data values. Countries appear in varying shades of blue, with hovering over a country turning it orange and revealing its specific value in a tooltip. The map uses D3 v7 with a natural Earth projection via `d3.geoNaturalEarth1` and renders geographic paths with `d3.geoPath`. It loads TopoJSON country boundaries from the world-atlas package, converts them to GeoJSON, and applies a sequential color scale with `d3.scaleSequential` and `d3.interpolateBlues`.

Apr 12, 2026

Loading thumbnail…

ice-8

This example renders a full-screen, animated canvas scene of crystal-like ice formations. It uses the raw Web Canvas API and JavaScript’s `requestAnimationFrame` loop to continuously draw and redraw geometric shards with shifting opacity and rotation, simulating a slow, drifting ice field. The page structure is minimal HTML with external `styles.css` for typography and `index.js` for logic; although the provided source only logs “hello world” to the console, the visual effect is achieved through direct canvas pixel manipulation and per-frame state updates rather than a third-party library.

Apr 12, 2026

Loading thumbnail…

Fork of HTML Starter

This fitness dashboard presents three coordinated D3.js (v7) charts built from CSV data. A reusable scatter plot maps workout minutes against calories burned, with point colors encoding intensity levels. The page also includes a pie chart showing total calorie distribution by intensity and a line chart tracking daily calorie trends. The implementation uses `d3.csv()` to load data, `d3.scaleLinear` and `d3.scaleOrdinal` for scales, `d3.axisBottom` for axes, `d3.pie()` and `d3.arc()` for the pie, all rendered as SVG elements.

Mar 29, 2026

Loading thumbnail…

D3 Starter

This example presents a multi-series line chart tracking Apple stock prices, showing open, close, and high values over time, alongside a combined bar-line chart where bars represent open prices and a line tracks closing prices. It uses the D3.js library (v7) to load CSV data from a Plotly dataset, parse dates with time scales, and render charts as SVG elements. The implementation features gridlines, legends, axis labels, and scales generated through d3.scaleTime, d3.scaleLinear, d3.scaleBand, and d3.line.

Mar 9, 2026

Loading thumbnail…

scatterplot

This scatterplot visualizes the relationship between flipper length and body mass for penguins, revealing a positive correlation between the two measurements. The visualization uses d3.csv to load the penguins dataset from the seaborn-data GitHub repository, filtering out entries with missing values before plotting. D3 v7 scales map the data to SVG coordinates, with d3.axisBottom and d3.axisLeft generating the labeled axes, while steelblue circles at radius 4 mark each penguin observation.

Mar 9, 2026

Loading thumbnail…

ICE6-BarChart-Deepshika

This bar chart displays quiz scores for the first 20 students from a CSV dataset, with each bar representing an individual student’s score. The visualization uses D3 v7’s `scaleBand` and `scaleLinear` to map student IDs and scores, while animated bars appear via `transition()`. Hovering a bar triggers a tooltip showing study hours and practice questions. The SVG includes grid lines, axis labels, and value labels, all styled with custom CSS classes.

Mar 9, 2026

Loading thumbnail…

DeepshikaThakur_ICE5

This example shows a dataset summary and an SVG bar chart of total workout minutes grouped by intensity level, based on a CSV file of workout entries fetched from a remote URL. The page uses D3 v7’s `d3.csvParse`, `d3.rollups`, `d3.sum`, and `d3.scaleBand` with `d3.axisBottom` and `d3.axisLeft` to build the chart. It also displays file size, row and column counts, and a preview table of the first six rows.

Mar 2, 2026