Skip to main content
SimilarExport ZIP
100%

Final Project

✓ Published1🌍 Public
Wwusushi
Last edited Dec 14, 2020
Created on Dec 5, 2020
Forked from HTML Starter

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.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

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
93% 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 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.

Hhsiaoping-nthu
75% match
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
72% 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
72% 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
71% match
Loading thumbnail…

Final project

This interactive visualization explores global happiness data from 2015–2023, allowing users to switch between a choropleth map, leaderboard, line chart, and correlation matrix. The map colors countries by selected factors using d3.scaleSequential with interpolateYlGnBu, while the line chart compares individual country trends against the global average. The visualization uses d3-geo projections, d3-scale-chromatic, and SVG rendering, with support for zooming, tooltips, and animated year sliders.

Yyihsuan
70% match
Loading thumbnail…

全國運動場館

This visualization shows a map of Taiwan's counties, rendered as an SVG using D3.js version 6. The map uses a Mercator projection with a custom center and scale, and each county is drawn as a path with a light green fill and gray stroke. Hovering over a county triggers a CSS hover effect that changes the fill to light gray, and a simple tooltip displays the county name via a title element. The geographic data comes from a local GeoJSON file loaded with `d3.json`, and the paths are generated using `d3.geoPath`. The React framework is mentioned in the metadata but is not used in the provided code, which relies on plain D3 selections and SVG manipulation.

YYang Shun Yu
69% match