eeshani.boyapati@gmail.com

@Eeshani15·14 public vizzes

Fork of ice8_q2.3_network

This is a force-directed network graph of a student-course relationship dataset. It visualizes three students (Anitha, Chetan, Navya) and five courses (CN, AI, DBMS, ML, DPDB, Python) using `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` forces. Nodes are rendered as SVG circles, with pink for students and purple for courses, connected by gray lines. Labels are positioned to the right of each node.

Apr 12, 2026

Loading thumbnail…

Fork of Ice_8_q2_tree

A static tree diagram visualizes a three-level food hierarchy with root, category, and item nodes, using pink, purple, and orange circles for depth. The d3.v7 library's hierarchy and tree functions compute the layout, while SVG elements draw lines for links, circles for nodes, and text labels for names. The dataset is hardcoded in JavaScript, and the render uses a 900 by 500 pixel SVG canvas.

Apr 12, 2026

Loading thumbnail…

Fork of Map

This choropleth shows global crime rates by country, with a pink-to-purple sequential color scale indicating values from 0 to 50. The map uses the Natural Earth projection via `d3.geoNaturalEarth1` and renders country boundaries as SVG paths from the world-atlas TopoJSON dataset. A hardcoded `Map` object supplies crime values for a few nations (e.g., USA, India, China), which are mapped to fill colors using `d3.scaleSequential` with `d3.interpolateRdPu`. Interactive tooltips display each country’s crime rate or "No Data" on hover, driven by `d3.geoPath` and D3’s event listeners.

Apr 12, 2026

Loading thumbnail…

Fork of Task 3

This fork of Task 3 displays monthly expense categories as overlapping filled areas in an SVG area chart, using d3.area to stack housing, food, transportation, utilities, and entertainment values. The code loads data from monthly.csv, applies d3.scalePoint and d3.scaleLinear for axes, and colors each category with d3.scaleOrdinal and d3.schemeCategory10. Semi-transparent fills allow categories to be compared across months, with axis labels generated via d3.axisBottom and d3.axisLeft.

Mar 24, 2026

Loading thumbnail…

Fork of Task 2 line

This fork of Task 2 uses D3 v7 to render a multi-line chart of monthly household expenses across five categories—housing, food, transportation, utilities, and entertainment—for a full year. It uses `d3.csv` to load the data, `d3.scalePoint` and `d3.scaleLinear` for the axes, and `d3.line` to generate each category’s path. A color legend is built with `d3.scaleOrdinal` and `d3.schemeCategory10`. The SVG output includes labeled axes and a legend on the right side.

Mar 24, 2026

Loading thumbnail…

Fork of Fork of Reusable D3 pie Plot

This household expenses pie chart visualizes the proportional spending across eight categories, such as Housing, Food, and Education, with each slice labeled by its percentage of the total. The chart is rendered using the D3 v7 library, which uses `d3.pie()` to compute arc data, `d3.arc()` to generate the SVG paths, and `d3.scaleOrdinal()` with `schemeCategory10` for colors. A legend on the right side lists each category with its original value, and the entire visualization is created with SVG elements. Data is loaded from a local `expenses.csv` file using `d3.csv()`.

Mar 24, 2026

Loading thumbnail…

Fork of ice-7-task2

This fork of ice-7-task2 visualizes monthly expenses across five categories—housing, food, transportation, utilities, and entertainment—as a multi-line chart. The D3 v7 code loads data from a CSV file and renders an SVG with smooth monotone curves for each category, distinguished by a categorical color scheme. It uses `d3.scalePoint` for the month axis, `d3.scaleLinear` for the expense axis, and `d3.line` with `d3.curveMonotoneX` to generate the lines, while also adding individual data points and a right-side legend.

Mar 24, 2026

Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This scatter plot shows the relationship between horsepower and fuel efficiency for ten car models, with points colored by cylinder count (4, 6, or 8) and a legend indicating the mapping. It uses D3 v7’s `scaleLinear` for axes, `scaleOrdinal` for color, and `axisBottom`/`axisLeft` for tick marks. The SVG circles are positioned via the `cx` and `cy` attributes. Data is loaded from a local `cars.csv` file.

Mar 24, 2026

Loading thumbnail…

Assignment 3

This visualization compares average screen time, sleep hours, and GPA across six student groups using a combined bar and line chart. Gray bars represent average screen hours, while blue, green, and red lines depict trends for screen time, sleep, and GPA, respectively. The chart uses D3’s `scaleBand` for categorical x-axes, `scaleLinear` for the y-axis, and `d3.line` to connect summary points. Data is loaded from a CSV via `d3.csv`, grouped into six slices, and aggregated with `d3.mean` to compute group averages.

Mar 6, 2026

Loading thumbnail…

Assignment task 2

This scatter plot visualizes the relationship between screen hours and sleep hours for individual students, with each point colored by GPA using a sequential plasma scale. The visualization loads CSV data from a GitHub gist via `d3.csv`, then renders circles in an SVG container. It uses `d3.scaleLinear` for both axes, `d3.scaleSequential` with `d3.interpolatePlasma` for color encoding, and includes gridlines, axis labels, and an interactive tooltip that displays RollNo, screen hours, sleep hours, and GPA on mouseover/mousemove. Axes are generated with `d3.axisBottom` and `d3.axisLeft`.

Mar 6, 2026

Loading thumbnail…

Assignemnt

This bar chart ranks 26 students by their daily screen hours, displaying each roll number on the vertical axis and screen time on the horizontal axis. The bars are sorted in descending order, with black bars that turn steel-blue on hover and a tooltip showing the exact roll number and hours. Built with D3 v7, the visualization loads CSV data via `d3.csv`, uses `d3.scaleBand` for the categorical axis, `d3.scaleLinear` for the numeric axis, and renders as SVG with gridlines created through `d3.axisBottom`.

Mar 6, 2026

Loading thumbnail…

Fork of ICE-5: The Shapes of Data

Built with D3 v7 and React, this example presents an interactive bar chart that displays labeled and measured fields from a dataset. Users select which data columns to visualize through dropdown menus and can toggle descending sort order. The chart renders as SVG with hover tooltips showing values, while summary cards update to reflect aggregate statistics. The fork is based on an original work by ICE-5.

Feb 28, 2026

Loading thumbnail…

Fork of index(11823810).html

This example presents an interactive data visualization dashboard for exploring CSV datasets. It loads user-selected data, summarizes key statistics on-page, and renders the values as interactive SVG bar charts with tooltips and clickable elements. Built with D3 v7, the visualization uses standard D3 selection and scaling APIs to map data to graphical marks. The interface also provides controls for data loading and styling, with all chart elements rendered as animated SVG within a responsive layout.

Feb 28, 2026

Loading thumbnail…

f ICE-5: The Shapes of Data

A dynamic bar chart visualizes screen hours per student from a remote CSV file, alongside summary statistics for rows, columns, numeric columns, and file size. The visualization loads data via `fetch`, parses it with `d3.csvParse` and `d3.autoType`, and renders an SVG chart using `d3.scaleBand` and `d3.scaleLinear` for axes. Tooltips display student names and hours via SVG `title` elements. The example runs within a React framework, though chart construction relies on D3 v7 APIs.

Feb 28, 2026