Skip to main content
SimilarExport ZIP
100%

Fork of D3 Starter

✓ Published0🌍 Public
Kkmuddana@gitam.in
Last edited Mar 30, 2026
Created on Mar 30, 2026
Forked from D3 Starter

This example shows monthly sales trends with a smooth monotone line chart, rendered as an SVG with animated tooltip interactions. It loads data from a CSV via `d3.csv`, maps months to a point scale and sales values to a linear scale, then draws the line using `d3.line` with `curveMonotoneX`. Circles mark each data point, and hover events trigger a tooltip that displays month and sales values. Axis labels and axes are added with `d3.axisBottom` and `d3.axisLeft`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of D3 Starter

This example displays sales, revenue, and profit trends from a CSV file using two D3.js v7 charts: a multi-series line chart and a combined bar-and-line chart. It uses `d3.csv`, `d3.scaleTime`, `d3.line`, and `d3.axisBottom` for data loading, scaling, and rendering, with tooltips via `d3.select` and a Poppins font for typography.

Ssainishanthreddyk@gmail.com
88% match
Loading thumbnail…

Fork of Fork of D3 Starter

This example presents an average monthly sales bar chart, displaying sales data from a CSV file across repeated calendar years. The visualization aggregates repeated monthly entries into bars, showing the overall sales distribution for each month. Built with D3 v7, the code loads data via `d3.csv`, maps sales values to numbers, and constructs the chart using `d3.scaleBand` for the x-axis and `d3.scaleLinear` for the y-axis. SVG rectangles represent each bar, while `d3.axisBottom` and `d3.axisLeft` render the axes, with a title added as an SVG text element.

KKOLLIPATI NIKHIL
87% match
Loading thumbnail…

Fork of D3 Starter 3

This multi-series line chart shows the daily trends of sales, profit, and expenses over the first half of 2024, applying D3’s `scaleLinear` and `scaleUtc` to map the data. It renders three monotone curves via `d3.line()` and `d3.curveMonotoneX`, using ordinal colors for each series and displaying interactive tooltips on hover. The visualization includes rotated monthly axis ticks, a legend, and axis labels, all drawn as SVG elements.

Vvijaysaichigullapally1@gmail.com
87% match
Loading thumbnail…

Fork of React & D3 Starter

This example shows a line chart of monthly sales figures using an SVG rendered with D3 v7. The visualization plots sales data from a CSV file, adding red circular markers for each data point and a green line to connect them. The code uses D3’s `scalePoint` and `scaleLinear` for axes, `line` for the path, `axisBottom` and `axisLeft` for ticks, and `csv` to load the data.

Ppvvaishnavi93@gmail.com
86% match
Loading thumbnail…

Fork of Fork of D3 Starter

This visualization presents daily sales, revenue, and profit trends from a CSV dataset across two SVG charts. The first chart displays three overlaid time-series lines for each metric, with colored dots for each data point. The second combines bars for sales with a line for profit, using hover-triggered tooltips for interactivity. Built with D3 v7, it uses `d3.csv` for data loading, `d3.scaleTime` and `d3.scaleLinear` for axes, and `d3.line` for path generation. Gridlines, axis labels, and a legend support readability.

Ssainishanthreddyk@gmail.com
86% match
Loading thumbnail…

Fork of D3 Starter

This visualization combines a bar chart and line chart to show sales, profit, and expenses over time. The chart displays orange, semi-transparent bars for sales alongside blue, green, and red lines for sales, profit, and expenses, respectively. It uses d3.csv to load data from an external GitHub-hosted CSV file. The SVG rendering relies on d3.scalePoint, d3.scaleLinear, and d3.line to map the categorical months and numeric amounts, with d3.axisBottom and d3.axisLeft for axes and additional gridlines.

Ccsesomarajuaswini@gmail.com
86% match
Loading thumbnail…

Fork of D3 Starter

This example shows monthly Sales, Profit, and Expenses for a company from 2013 to 2015, combining translucent blue bars for sales with colored lines for each metric. The visualization uses D3 v7 to load CSV data, with `d3.scaleBand` and `d3.scaleLinear` for axes, `d3.line` for the line paths, and `d3.axisBottom` and `d3.axisLeft` for ticks. A hover tooltip and a color-coded legend support interpretation of the multi-series data.

Ddeepthinaidu2001@gmail.com
85% match
Loading thumbnail…

Fork of Fork of Fork of D3 Starter

This visualization analyzes daily sales, revenue, and profit trends using two D3.js v7 SVG charts. A multi-series line chart displays all three metrics over time, while a combined chart overlays sales as bars with a profit line, both featuring custom tooltips and a styled interface using the Poppins font. The code loads CSV data via `d3.csv`, constructs scales with `d3.scaleTime` and `d3.scaleLinear`, and renders paths and bars with `d3.line` and `d3.axisBottom`, applying color-coded series and gridlines for readability.

Ssainishanthreddyk@gmail.com
85% match