Skip to main content
SimilarExport ZIP
100%

Multi line chart

✓ Published0🌍 Public
SSreedevi Itta
Last edited Oct 19, 2025
Created on Oct 19, 2025
Forked from HTML Starter

This multi-panel dashboard visualizes loan data trends using D3.js (v7) with SVG rendering. The first panel displays a multi-series line chart comparing normalized applicant income, coapplicant income, and loan amounts across records. The second panel combines bars showing average loan amounts by property area with a line depicting the percentage of credit history equal to 1. The code fetches CSV data via a GitHub Gist URL, parses it with `d3.csvParse`, and dynamically generates both charts using D3's SVG API, including axes, grid lines, and legends.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Multi-Series Line + Combined (Bar+Line)

This dashboard presents two charts built with D3.js v7 from a CSV sales dataset. The top visualization uses a multi-series line chart to track monthly trends for Sales and Profit. The bottom chart combines bars for Sales with an overlaid line for Profit Margin, providing a dual-axis view of volume versus efficiency. Data is parsed and aggregated by month using `d3.rollups` and `d3.timeParse`, with axes, grids, and scales configured via `d3.axisLeft`, `d3.axisBottom`, and `d3.scaleUtc`. Rendering uses SVG within a dark-themed HTML container.

RRamdas Dheeraj
75% match
Loading thumbnail…

creditHistory_multi series line and combined(Line+ Bargraph)

This example features a credit history dataset in two linked D3.js charts. The first is a multi-series line chart exploring up to three quantitative variables against a numeric X-axis, with controls for axis selection and sample size limiting. The second is a combined chart where bars and a line present categorical or numeric data, and both use drop-down menus for interactive data filtering. The visualizations are built with SVG, animated scales, and rely on D3’s CSV parsing, `scaleLinear`, and axis generators.

Mmaddineni2112@gmail.com
75% match
Loading thumbnail…

Multiline & Combined

Two D3.js v7 SVG charts display monthly data from ICE.csv. The first is a multi-series line chart plotting signups, revenue, and support tickets over time on a shared axis, using distinct pastel strokes and a legend. The second combines a bar chart of revenue with an overlaid line for support tickets, using shared time and value scales. Both charts employ d3.csv, d3.timeParse, d3.scaleTime, d3.scaleLinear, d3.line, and d3.axisBottom/axisLeft.

Mmaddulanagasanjana@gmail.com
73% match
Loading thumbnail…

Fork of Line Chart

This example displays a line chart of US auto sales from 2005 to 2022, using applicant income on the x-axis and loan ID on the y-axis, with red strokes marking the trend. Built with D3 v5, the code uses `csv` to load external loan data, `scaleTime` and `scaleLinear` for axes, and `line` to generate the path. The SVG rendering includes labeled axes, a title, and gridlines via `axisLeft` and `axisBottom`.

Rradhadevarapu
72% match
Loading thumbnail…

multi charts

This example presents two SVG charts built with D3.js v7, both visualizing daily sales trends for three series (A, B, C) from `sales_trends.csv`. The top chart displays multi-series line plots, while the bottom combines bars for series A and B with an overlaid line for series C. The code uses `d3.csv` with `d3.autoType` for data loading, `d3.scaleTime` and `d3.scaleLinear` for axes, and renders interactive tooltips styled via CSS.

MManeesh Kumar
72% match
Loading thumbnail…

Project

This example visualizes the income distribution of loan applicants using a pie chart. The chart is rendered as an SVG element within an HTML page, with each slice labeled by its category and displayed value. The visualization is built with D3.js version 5, specifically using the library’s SVG generation and layout capabilities to compute the pie slices and position text labels. The chart is presented with a bold title and a legend, all styled through CSS. The data, loaded from a bundled script, drives the pie’s proportions, while the rendering remains fully static SVG without animation or interaction.

Lleelakrishnadivi7@gmail.com
72% match
Loading thumbnail…

ICE - 7 Pie Chart

This interactive pie chart visualizes loan details, displaying applicant income segments with color-coded sections and a corresponding legend that maps Loan IDs to income values. Built with React and D3 v5, it uses `d3.csv` to load data from a GitHub gist, then applies `d3.pie` and `d3.arc` to generate the chart’s paths, with `scaleOrdinal` assigning colors. The SVG rendering includes formatted income labels in thousands (e.g., "5K") via `d3.format`, and the legend is manually positioned alongside the pie.

Aachyutanandmishra17@gmail.com
71% match
Loading thumbnail…

Fork of Nikita's Pie Chart

This example visualizes loan data from a CSV file as a pie chart, with each slice representing a loan’s ApplicantIncome and colored by its Loan_ID. A legend lists the Loan_IDs along with their associated rating points. The chart is built with D3 v5, using `d3.pie` and `d3.arc` to generate SVG paths, `d3.scaleOrdinal` for colors, and `d3.format` for tick labels. Data is loaded asynchronously via `d3.csv`.

CCHANDU BHARGAVI
71% match