Skip to main content
SimilarExport ZIP
100%

Fork of COSMETICS PRODUCTS

✓ Published0🌍 Public
Aadapavaishnavi12
Last edited Mar 23, 2023
Created on Mar 23, 2023
Forked from COSMETICS PRODUCTS

This chart is a horizontal bar chart visualizing cosmetic product revenues in dollars. It compares the revenue of each product, with the bars sorted in descending order and labeled on the y-axis. The chart has a pink color scheme and uses a linear scale for the revenue axis and a band scale for the product categories. Built with D3 v5, the code uses `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render the SVG. The data is loaded from an external CSV file using `d3.csv`.

AI-generated description

ICE-6

MIT Licensed

Similar vizzes

Loading thumbnail…

COSMETICS PRODUCTS

This bar chart displays cosmetic product revenue in dollars, with product categories listed on the y-axis and revenue amounts on the x-axis. The visualization uses d3.scaleLinear and d3.scaleBand to map data values to pixel coordinates, with d3.axisBottom and d3.axisLeft generating the axes. Data is loaded from a CSV file hosted on GitHub via d3.csv, and the chart renders as SVG rectangles filled pink, with formatting applied through d3.format to display values in billions.

Aadapavaishnavi12
92% match
Loading thumbnail…

Fork of Fork of ICE-6 Tutorial Bar Chart

This horizontal bar chart displays the top 10 cosmetic products by revenue, with each bar’s length proportional to its dollar value. The visualization uses D3 v5, employing `scaleLinear` and `scaleBand` to map revenue and product names, while `axisLeft` and `axisBottom` render the axes. Data is loaded via `d3.csv` from a remote GitHub gist, and the chart is drawn as SVG elements with a custom tick formatter that abbreviates large numbers.

DDINESH SAI BOPPANA
83% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue in dollars, using a horizontal layout with a linear x-scale and a banded y-scale. The visualization is built with D3 v5, leveraging the `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` APIs to render axes and bars. Data is loaded from a CSV file via `d3.csv`, with revenue values parsed as numbers. The chart includes axis labels and custom tick formatting that converts large numbers from G to B. The SVG canvas is 860 by 450 pixels, with margins arranged for clear presentation.

DDINESH SAI BOPPANA
82% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This horizontal bar chart displays the top 10 cosmetic products by revenue, using data sourced from a CSV file hosted on GitHub. The visualization employs D3 v5's scaleLinear and scaleBand to map revenue values and product names, and renders the chart as SVG. The axes are customized using axisBottom and axisLeft, with tick formatting that converts large numbers to abbreviated forms and removes grid lines from the y-axis. The X-axis label and title are added via SVG text elements.

Ggayathri
82% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue, using a horizontal layout where product names are on the y-axis and revenue in dollars on the x-axis. The visualization is built with D3 v5, using `scaleLinear` and `scaleBand` to map data, and `axisLeft` and `axisBottom` for customized axes with tick formatting that converts large numbers to abbreviations. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles. The chart includes a title and axis label, with a light styling applied through external CSS.

Vvegurusaiprathyusha
81% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This bar chart displays the top 10 cosmetic products by revenue, using a horizontal layout where product names are on the y-axis and revenue in dollars on the x-axis. The visualization is built with D3 v5, using `scaleLinear` and `scaleBand` to map data, and `axisLeft` and `axisBottom` for customized axes with tick formatting that converts large numbers to abbreviations. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles. The chart includes a title and axis label, with a light styling applied through external CSS.

Vvegurusaiprathyusha
81% match
Loading thumbnail…

Fork of ICE-6 Tutorial Bar Chart

This horizontal bar chart displays the top 10 cosmetic products by revenue, with dollar amounts scaled along the x-axis and product names on the y-axis. It uses d3.csv to load data from a GitHub gist, then renders SVG rectangles with d3.scaleLinear and d3.scaleBand. Custom axes are built with d3.axisLeft and d3.axisBottom, including tick formatting that abbreviates large numbers with d3.format. The chart demonstrates margin-based layout and axis customization within an SVG canvas.

Iiamhassanrazaahr
81% match
Loading thumbnail…

Top 10 Cosmetic Products by Revenue

A horizontal bar chart ranks the top ten cosmetic products by revenue, from Eyeshadows at the top to Powder at the bottom. Each bar’s length encodes the dollar value, with the x-axis labeled “Reveune in Dollars.” Built with D3 v5, the visualization uses `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft`, and formats tick labels with `d3.format`. Data comes from a CSV file, rendered as SVG rects with a steelblue fill, and includes a title and gridlines via `tickSize`.

Sskambhore04
81% match