Fork of Page Title

100%

Fork of Page Title

✓ Published0🌍 Public

Aannie520143

Last edited Jan 10, 2021

Created on Jan 10, 2021

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.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Portland Map

This visualization displays the neighborhoods of Portland, Oregon as a geographic map rendered using SVG paths. The map is projected using `d3.geoConicEqualArea` and drawn with `d3.geoPath`, with TopoJSON data converted to GeoJSON via the `feature` function. The React component `Marks` iterates over the map features to generate each neighborhood path, styled with teal strokes. The map title “Taiwan” appears in the HTML, though the actual data represents Portland boundaries.

TTekmal-Bhavana

76% 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

76% match

Loading thumbnail…

Fork of Fork of Taiwan Earthquake

This interactive visualization explores Taiwan earthquake data from March 2023 to March 2024 using a synchronized map and scatterplot. Users can filter by year and select the x and y attributes, with point size encoding magnitude and color encoding depth, magnitude, or quality. The map uses d3.geoMercator projection with topojson for Taiwan’s county boundaries, while custom tooltips and a zoomable SVG interface reveal details on hover. The scatterplot dynamically updates its axes and legend based on user selections.

XXyfer

76% match

Loading thumbnail…

Fork of Swedish map

This visualization displays a map of Swedish counties using a Mercator projection, with the counties filled in teal and their borders drawn in a complementary green. The code loads GeoJSON data via `d3.json`, processes it with the TopoJSON `feature` and `mesh` functions to extract county geometries and interior boundaries, and renders them as SVG paths using `d3.geoPath` within a React component. The map is fitted to the viewport, and the styling is applied through CSS classes.

AAndre J Denais

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

75% match

Loading thumbnail…

Fork of Taiwan Earthquake

This interactive visualization explores Taiwan earthquake data, showing a map of seismic activity and a linked scatterplot to investigate spatial patterns, correlations between magnitude and depth, and temporal trends. The map uses a Mercator projection via `d3.geoPath` with zoom functionality, while the scatterplot offers selectable axes and color attributes. A tooltip provides additional detail, and the visualization includes a legend for clarity. The code leverages D3 v5, TopoJSON for map shapes, and Turf.js, with data sourced from the Taiwan Geophysical Database Management System.

Jjerry70938@gmail.com

75% match

Loading thumbnail…

towns

The visualization displays the geographic distribution of towns across Taiwan, using their names, county affiliations, and administrative codes from a CSV dataset. It presents a map-like layout where each town is depicted as a point or region in relation to its county, with labels showing traditional Chinese names and English romanizations. The code leverages d3.geoPath to render town boundaries or locations from the geospatial data, while d3.forceSimulation could arrange overlapping points into a readable pattern. The rendering relies on Canvas and browser APIs to draw the map, with the source data sourced from a gist by GeoWill.

GGeoWill

74% match

Loading thumbnail…

Fork of map

This visualization displays a map of the United States, with each county filled using a categorical color scale based on its name. It renders these counties as SVG paths generated by `d3.geoPath` with the `geoAlbersUsa` projection, sourcing geographic data from a US Atlas TopoJSON file. The counties are outlined in red with low opacity, and they highlight yellow on hover. The visualization uses D3 v5 and the `topojson` library’s `feature` function to extract the geometries from the `counties-10m.json` dataset.

Rreddysushma994@gmail.com

74% match