Skip to main content
SimilarExport ZIP
100%

Final Project

✓ Published0🌍 Public
Hhsiaoping-nthu
Last edited Jan 11, 2023
Created on Jan 11, 2023
Forked from D3 Starter

This interactive dashboard visualizes Taiwan’s agricultural production and market prices, combining a choropleth map of county-level fruit harvest metrics with linked bar and line charts for daily transaction quantities and monthly price trends. Users filter by fruit type, market, and date range through custom dropdowns and date pickers, with map hover tooltips showing production shares. Built with D3 v7 and TopoJSON, the map uses SVG paths with mouseover highlighting, while charts employ D3 scales and axes. Data is fetched from Taiwan’s COA open API via `d3.json`, and CSV data drives the map choropleth.

AI-generated description

A demonstration of how to start using D3 version 6.

MIT Licensed

Similar vizzes

Loading thumbnail…

VizFinal

An interactive dashboard combines a choropleth map of Taiwan with bar chart, line chart, and bubble chart views of agricultural statistics. Users select fruits, years, and data columns from dropdown menus to query a CSV dataset, while clicking counties on the map highlights them and reveals temporal trends. The visualization uses D3 version 7 with geoMercator and geoPath for map projection, axisBottom for chart axes, and transition animations for smooth updates.

Aaaron.chu626@gmail.com
84% match
Loading thumbnail…

Final ProjectV2

This interactive visualization displays average housing prices across Taiwanese counties from 2012 to 2020. Users click on a map of Taiwan rendered as SVG paths to select regions, which adds corresponding line charts to a time-series graph. The visualization uses D3 v5 for scales, axes, and line generation, with Vue and jQuery handling user interaction and state updates. Historical housing data is loaded from a GitHub-hosted JSON file, and each selected county appears as a colored trend line with a label in the right margin.

Wwusushi
77% match
Loading thumbnail…

Final Project2

This visualization displays Taiwan’s national and six-municipality demographic trends from 2010 to 2021, comparing natural increase rates against birth, death, marriage, and divorce rates. A dropdown menu lets viewers switch between regions, updating a multi-line chart rendered as SVG. The chart uses d3.scaleLinear and d3.line to draw trends, with axes generated via d3.axisLeft, d3.axisRight, and d3.axisBottom. Data is loaded from a CSV file using d3.csv, and rates are computed by scaling raw counts against population figures.

Cchristina030
75% match
Loading thumbnail…

Final Project

This visualization displays the average housing prices across Taiwan by region and year, rendered as an interactive SVG map. A slider allows users to select a year from the available data, while clicking or hovering over a region highlights it and updates a Vue-powered display to show the selected county and year. The project uses D3.js (v6) for the slider and map interactions, Vue 2 for the dynamic text updates, and jQuery for handling mouse events. Data is loaded asynchronously from a remote JSON file containing aggregated price statistics.

Wwusushi
75% match
Loading thumbnail…

draw_tw

This interactive visualization maps Taiwan's counties, colored by a selected demographic or economic indicator from 2011 to 2021. Users can choose a metric via dropdown menus, triggering an animated bar chart that ranks counties alongside a national average line, while a line plot on the side tracks the temporal trend for the hovered county. The map is rendered using `d3.geoPath` on a TopoJSON topology, with choropleth coloring based on indicator values. The bar chart uses `d3.scaleBand` and `d3.scaleLinear` for layout, and the line plot uses `d3.line` with a gradient stroke that changes color based on yearly increases or decreases.

Aaaron.chu626@gmail.com
74% match
Loading thumbnail…

Final project

This visualization compares population growth between Taiwan and the United States from 99 to 110 years, displaying animated bar charts that rank regions by population. The bars update dynamically each year, with the current year displayed prominently and tooltips showing exact population values on hover. The animation uses `d3.interval` to cycle through yearly data, while `d3.scaleLinear` and `d3.axisTop` handle the chart scaling and axes. The visualization also includes a separate line chart plotting population rates for Taiwan, rendered with `d3.line` and interactive circles for each data point.

Cchristina030
73% match
Loading thumbnail…

Project

This interactive dashboard visualizes Taiwanese outbound traveler flows by country and month, using animated bar charts to show passenger volumes for specific airports or seaports. Users filter by year, transport mode (airplane or ship), and individual countries across continents, with a month slider and sorting options for distance or quantity. Built with React and D3.js, the project renders SVG bar charts that update dynamically, pulling data from a CSV file containing annual and monthly travel statistics for destinations across Asia, the Americas, Europe, and Oceania. The interface also provides a slider to scrub through months and a dropdown to sort results, enabling comparative analysis of travel patterns over time.

TTimmyLu
72% match
Loading thumbnail…

Fork of Page Title

This visualization displays a map of Taiwan's counties and municipalities, rendered as an SVG using D3.js. The map uses a Mercator projection centered on Taiwan, with county boundaries drawn using TopoJSON topology data. Each county polygon is interactive, highlighting in yellow on mouseover. The visualization relies on D3's geo projection and path APIs, alongside TopoJSON's mesh and feature methods, with a CSS gradient background applied to the page.

Aannie520143
71% match