Skip to main content
SimilarExport ZIP
100%

Cost Analysis

✓ Published0🌍 Public
Zzhu
Last edited Aug 1, 2020
Created on Jul 31, 2020
Forked from Cost Analysis

Two side-by-side pie charts compare one-year versus ten-year cost breakdowns for categories including Blue-light and Security Guard, using data loaded from CSV files. The D3 v5 code builds an SVG visualization with a title, and the charts are rendered using `d3.pie` and `d3.arc` with labels generated via `arcLabel.centroid`. A color scale from `d3.scaleOrdinal` and `d3.schemeAccent` distinguishes categories, while text elements display names and dollar values on each slice.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Cost Analysis

The visualization compares one-year versus ten-year costs for two job roles, shown as a pair of side-by-side pie charts. It uses D3 v5’s `d3.pie` and `d3.arc` to generate the slices, with `d3.scaleOrdinal` assigning categorical colors. Data is loaded from two separate CSV files via `d3.csv`, and both charts are rendered as SVG inside a shared `<svg>` container. The title “one year cost vs ten years” and dollar-value labels make the quantitative comparison explicit.

LLex
88% match
Loading thumbnail…

Pie Chart

This pie chart visualizes the basic cost of each country, with slices colored by country and a legend displaying names and dollar amounts. The D3.js v5 code loads CSV data from a GitHub gist and uses `d3.pie` and `d3.arc` to generate the SVG paths, with `d3.scaleOrdinal` and `schemeCategory10` for colors. A hover event logs the country and cost to the console, while the legend is built from the same pie data.

CChaitanya Ratan Sree
76% match
Loading thumbnail…

Pie Chart

This pie chart visualizes monthly expense categories from a CSV file, displaying each category's proportion with a colored slice and an outer label. Each slice is rendered with the `d3.arc` path generator, while labels are placed using `d3.arc` centroid calculations. A legend lists categories and values, using `d3.scaleOrdinal` with `d3.schemeCategory10` for colors. The chart is built with D3 v7, rendering to SVG, with the `d3.pie` layout function computing slice angles from the data.

Ppvvaishnavi93@gmail.com
75% match
Loading thumbnail…

Pie Chart

A pie chart displays monthly expenses across five categories—Rent, Food, Travel, Shopping, and Bills—with proportional slices and a matching legend. The visualization uses D3 v7’s `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to compute arc paths and colors, reading the `pieData.csv` file. Slice labels are placed using each arc’s centroid, while the legend lists categories with values. The SVG output is generated entirely with D3’s declarative API.

Ppvvaishnavi93@gmail.com
74% match
Loading thumbnail…

Pie Chart

This pie chart visualizes monthly expenses across five categories: Rent, Food, Travel, Shopping, and Bills. It uses the D3.js v7 library to compute arc paths with `d3.pie()` and `d3.arc()`, and renders each slice as an SVG path with labels positioned using `labelArc.centroid()`. A legend, built from the loaded CSV file, shows each category with its corresponding value and color from `d3.scaleOrdinal(d3.schemeCategory10)`.

Ppvvaishnavi93@gmail.com
74% match
Loading thumbnail…

Pie Chart

This pie chart visualizes the basic costs associated with the top 10 countries from a CSV dataset. It shows each country as a proportional slice of the pie, with values formatted in dollars and a legend listing country names and their corresponding costs. Hovering over a slice triggers a tooltip displaying the country and its cost. Built with D3 v7, the visualization uses the `pie` and `arc` functions to generate the chart, `scaleOrdinal` and `schemeCategory10` for color assignment, and SVG rendering for output.

CChaitanya Ratan Sree
74% match
Loading thumbnail…

Pie Chart

This pie chart displays monthly expense categories—Rent, Food, Travel, Shopping, and Bills—with proportional slices and a labeled legend. Built with D3 v7, it loads data from a CSV file, computes arc paths using `d3.pie()` and `d3.arc()`, and positions category labels via `labelArc.centroid(d)`. A categorical color scale (`d3.scaleOrdinal`) assigns colors, while the SVG rendering includes a title and a legend showing each category’s value. The chart is generated entirely with SVG elements and a custom legend.

Ppvvaishnavi93@gmail.com
73% match
Loading thumbnail…

Pie Chart

This example shows a basic pie chart of `basic_cost` values by country, using a Tableau10 color scale for each slice and text labels positioned at the arc centroids. The chart is rendered as an SVG within a 500×500 pixel container, with data loaded from a CSV hosted in a GitHub gist. Built with D3 v7, it creates the pie geometry with `d3.pie()` and `d3.arc()`, applies colors via `d3.scaleOrdinal`, and uses `d3.select` to set up the SVG group. The data parsing makes `basic_cost` numeric before generating the arcs.

CChaitanya Ratan Sree
73% match