Skip to main content
SimilarExport ZIP
100%

Untitled

✓ Published0🌍 Public
Aashpradhan01123
Last edited Jul 30, 2020
Created on Jul 30, 2020
Forked from HTML Starter

This interactive line chart visualizes COE (Certificate of Entitlement) prices in Singapore from 2010 to 2018, distinguishing between two monthly bidding exercises via radio buttons that toggle between the two series. The chart displays premiums for five vehicle categories (A through E) across time, with each category assigned a distinct color from a categorical scale. The visualization uses D3 v4 to parse CSV data, render SVG axes with gridlines, and apply time-based scaling. A legend with colored markers helps identify each category, while the responsive design incorporates Bootstrap for layout.

AI-generated description

A bare minimum HTML page.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This interactive chart shows Certificate of Entitlement (COE) prices in Singapore from 2010 to 2018, split by vehicle category and bidding exercise, using radio buttons to toggle between the two monthly bidding sessions. The visualization renders multi-series line charts with D3 v4, using `d3.scaleTime` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` for color mapping, while loading data from a CSV file.

Ddanala0941
94% match
Loading thumbnail…

Untitled

A line chart shows the annual value of CO2 emissions from 1995 to 2014, with each year represented by a white circle with a teal outline. The circles change their stroke to black on hover, and a tooltip displays the exact value for each point. The visualization uses D3 v4 to read the CSV data, build a time-scale X axis and a linear Y axis, and draw a smoothed curve using `d3.line()` with `curveBasis`. The SVG output includes axes, circles, and the path, while the tooltip is appended as an HTML div in the page.

Llamiyaa
69% match
Loading thumbnail…

Untitled

This interactive line chart visualizes the High and Low values of stock symbols from the National Stock Exchange of India, with an animated transition between the two metrics. A dropdown menu lets users switch between the High and Low series, triggering a smooth data update. The visualization uses d3.csv to load data, d3.scaleBand for the categorical x-axis, d3.scaleLinear for the y-axis, and d3.line to draw the path, with circles marking data points. The update function employs d3 transitions over 1000 milliseconds to animate the line and dots, rendered as SVG elements.

SSheela2930
68% match
Loading thumbnail…

Untitled

A stacked bar chart shows annual CO2 emissions for properties, with segments for gas and electrical sources, alongside a step-after line tracking normalized costs on a second axis. Data from a tab-separated CSV file includes property names, emission values, and cost metrics. The visualization uses d3.svg.axis for dual left and right axes, d3.scale.ordinal for property positioning, and d3.svg.line with step-after interpolation for the cost overlay. Dots mark the exact cost values, and a legend identifies the two emission categories.

Ddiegobrivo
67% match
Loading thumbnail…

Untitled

A line chart tracks stock closing prices over a three-week period in April–May 2012, with each data point drawn as a red circle from the CSV data. Interactive tooltips appear on mouseover, displaying the formatted date and closing value. The visualization uses D3.js version 3.5.17 to build an SVG with a time-scaled x-axis, linear y-axis, and animated transitions for the tooltip opacity.

SSrishti2398
67% match
Loading thumbnail…

Untitled

This interactive stacked area chart displays the changing values of multiple categories over time, using the D3.js library (version 2) with SVG rendering and animations. The chart employs a silhouette offset layout to visualize data from a CSV file, with color-coded layers representing different groups. Hovering over a layer highlights it and shows a tooltip with the category name and its specific value, while mouse movement on the chart also triggers a vertical guideline.

LLAOKE1997
67% match
Loading thumbnail…

Untitled

This interactive parallel coordinates chart visualizes a dataset of cars and their specifications, such as fuel economy, horsepower, and weight. Each car is represented by a line connecting its attribute values across multiple vertical axes. Users can drag axes to reorder them and use brush controls on each axis to filter which vehicles remain highlighted, with the background context paths hidden while dragging. The visualization is built with D3.js v3, using SVG for rendering, `d3.svg.axis` for axes, and `d3.behavior.drag` and `d3.svg.brush` for interaction.

QqOp3
67% match
Loading thumbnail…

Untitled

This bar chart visualizes total car sales across different locations, with each location represented by a vertical bar scaled against a fixed y-axis range of 0 to 13. The chart uses D3.js v4 to fetch data from a CSV file hosted on GitHub, then renders the visualization as an SVG. The code employs `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` to generate the axes. Bars are drawn as SVG rectangles with a teal fill color, and x-axis labels are rotated 45 degrees for readability.

MManideeprenikindi
66% match