Skip to main content
SimilarExport ZIP
100%

Ice_6_Yaswanth_duddu

✓ Published0🌍 Public
YYaswanth
Last edited Oct 20, 2025
Created on Oct 20, 2025
Forked from HTML Starter

This visualization combines a bar chart and multi-series line chart to display monthly Sales, Profit, and Expenses trends from a CSV dataset. Expenses are rendered as semi-transparent green bars, while Sales and Profit appear as blue and orange lines, respectively. The chart uses D3.js v6 with SVG rendering, employing `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axis, and `d3.line` for path generation. Interactive tooltips appear on bar hover, and the chart includes rotated month labels, axis titles, and a color-coded legend.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ice 6 multi_series

This multi-series chart tracks Sales, Revenue, and Profit trends for daily business metrics from January to July 2024. It overlays three colored lines on a time-based x-axis, with a combined bar chart highlighting selected sales data points. The visualization uses D3.v7 to render SVG elements, employing `d3.scaleTime` for the date axis, `d3.scaleLinear` for the value axis, and `d3.line` for drawing the series paths. An interactive legend identifies each metric, and the chart includes axis labels for clarity.

HHarshithaDontha@my.unt.edu
81% match
Loading thumbnail…

ICE-6(multi series)

This example combines bar and line charts to compare sales and profit across seven months, with bars encoding sales and a monotone line tracking profit. The SVG visualization is built with D3 v7, using `d3.scaleBand`, `d3.scaleLinear`, and `d3.line` with `d3.curveMonotoneX`. Interactive tooltips appear on bar and dot hover via mouse events, while gridlines, axis labels, and a custom legend clarify the dual-series data loaded from a CSV file.

Vvydeeshm@gmail.com
81% match
Loading thumbnail…

ICE_6_Yaswanth_duddu

This visualization is a scatter plot that shows the relationship between engine size and fuel efficiency (MPG) for different car types, with each point colored by vehicle category from the cars.csv dataset. The D3.js v6 code loads the data using `d3.csv` with `d3.autoType`, then creates linear scales for both axes via `d3.scaleLinear` and an ordinal color scale for the categorical variable. Circles are bound to data using the `enter()` selection, and interactive tooltips appear on mouseover. The SVG chart includes axes, labels, a title, and a legend, all rendered through D3's SVG rendering API.

YYaswanth
77% match
Loading thumbnail…

ICE6-Kumar Danam

This visualization shows yearly sales performance, combining bar charts for total sales in millions of dollars with a line chart for total units sold. The code uses d3.rollup to aggregate the raw CSV data by year, then d3.scaleBand and two d3.scaleLinear instances create dual axes. SVG rendering displays the bars and line, with axes, labels, and a legend using d3.axisBottom, d3.axisLeft, d3.axisRight, and d3.join.

KKumar Danam
77% match
Loading thumbnail…

ice6- q3

This visualization presents two views of monthly sales data from a sales_data_sample.csv file. The first is a multi-series line chart tracking sales trends for three product lines: Classic Cars, Motorcycles, and Planes. The second is a combined dual-axis chart that plots total sales and average sales together using `d3.rollups` to aggregate the data, with lines rendered via D3’s `d3.line` API and scales from `d3.scaleLinear`. The SVG is generated with D3 v7, and axes are drawn using `d3.axisBottom` and `d3.axisLeft`.

AAravindReddyJanke@my.unt.edu
77% match
Loading thumbnail…

ice 6 (bar+line)

This visualization combines a time-series line chart with a monthly bar overlay, showing three metrics (metric_A, metric_B, metric_C) over time alongside the monthly average of metric_A as semi-transparent blue bars. The code uses d3.csv and d3.rollup to aggregate the data, with d3.scaleTime, d3.scaleLinear, and d3.scaleBand for positioning, and d3.line for the trend lines. The SVG is rendered with an axis on the bottom and left, a legend on the right, and a light blue bar fill at 50% opacity. The source data is loaded from a GitHub Gist as a multiseries CSV.

Kkmuktha09@gmail.com
77% match
Loading thumbnail…

Ice-6

A bar chart displays the sales of various coffee products from a CSV dataset. It uses D3.js v3, loading data with `d3.csv` and rendering the chart with SVG. The x-axis uses `d3.scaleBand` for product categories, while the y-axis uses `d3.scaleLinear` for sales values. Bars are drawn as `rect` elements filled with steelblue and labeled with rotated text on the bottom axis. The visualization directly shows comparative sales figures across the coffee product lineup.

GGorantla Vishnusai
76% match
Loading thumbnail…

ICE_6_Amalgamated_Bar_Line

This visualization presents quarterly retail sales data in two complementary views. The first chart uses multiple line series with d3.line and d3.scalePoint to compare sales trends across North, West, and East regions. The second chart combines bar and line marks, using d3.scaleBand for advertising spending and a second linear scale for total sales, with data aggregated from a CSV file. The SVG rendering uses d3.axisBottom and d3.axisLeft for axes, while custom legends identify series colors.

Jjgaur96@gmail.com
76% match