Your page title goes here

100%

Your page title goes here

✓ Published0🌍 Public

Last edited Jan 14, 2014

Created on Oct 12, 2013

A map of Japan displays the impact of the 2011 Tōhoku earthquake and tsunami, with a side panel providing context and narrative text. The visualization uses CartoDB's JavaScript library to render the map, integrating with Google Maps API for the base layer. The layout combines a full-width map with a text panel, and the code includes responsive CSS to adjust the display on smaller screens. The map data is loaded from a CartoDB visualization URL.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 4354110

This visualization displays a map rendered with CartoDB, showing geographic data from a hosted visualization. The page loads a full-screen map using the CartoDB.js library, which initializes the map via `cartodb.createVis` and connects to a remote visualization URL. The map itself is embedded in a fixed-size `<div>` element and relies on CartoDB’s built-in rendering and tile services to draw the geographic layers. The code does not include custom data processing or interaction logic; it simply leverages the CartoDB API to present the pre-configured map.

Aandrewxhill

69% match

Loading thumbnail…

Gist 11071111

This visualization maps global earthquake intensity using CartoDB’s CartoCSS styling. It shows point markers scaled by the `mmio` attribute (Modified Mercalli Intensity), with larger circles for stronger quakes and zoom-dependent width increases. The code applies marker properties like `marker-type: ellipse`, `marker-fill`, and `marker-comp-op: multiply` to blend overlapping points, while labels display intensity values at higher zoom levels via `text-name`. The example uses CartoDB’s tile rendering and CSS-like rules to style geographic data without JavaScript libraries.

Aandrewxhill

68% match

Loading thumbnail…

Gist a61b3f54da810f6e9490

This example demonstrates how to map and animate earthquake data from the USGS CSV feed using CartoDB’s mapping tools. It shows temporal earthquake occurrences through an interactive map, with points updating over time. The code relies on CartoDB’s SQL API and JavaScript library for layer management, alongside D3.js for data-driven visualizations. It also integrates Chart.js for supplementary graphs and uses dynamic styling via CartoDB’s tile rendering. The visualization highlights both spatial distribution and time-based animation of seismic events.

Aandrewxhill

67% match

Loading thumbnail…

Japan Map

This example displays a map of Japan, centered within a full-page layout, on a light gray background. The visualization is built using JavaScript and relies on the D3.js library for map rendering and geographic projections. The map is rendered to the screen through the use of SVG paths generated by D3’s geographic path generator, which converts GeoJSON data into viewable shapes. The page structure is defined in HTML and styled with CSS, while the map’s appearance and positioning are controlled entirely through the D3 code in the included script.

66264kusuma@gmail.com

66% match

Loading thumbnail…

Gist 67fa3790166d6549f4a9

This interactive visualization pairs a large world map with a side panel, using D3’s `d3.forceSimulation` to scatter data points across geographic coordinates rendered via `d3.geoPath` and Canvas `getImageData` for pixel-level placement. The layout adapts responsively, and the code includes CSS themes for light or dark editorial styling, suggesting a map-based storytelling template.

Aandrewxhill

65% match

Loading thumbnail…

recent earthquakes (live update)

This visualization shows recent earthquake locations on an interactive map, with live updates embedded from a Carto map hosted by Stamen. The page uses an iframe to display the map, which pulls data from a Carto builder URL and renders it with the user’s browser. The surrounding code loads d3.v4 via a CDN but does not directly implement any d3 visualization logic; instead, the map handles all geographic rendering and interaction externally. The example demonstrates how a simple HTML page can integrate a third-party, data-driven map without custom JavaScript, relying on the embedded service for earthquake data and display.

AAlan McConchie

65% match

Loading thumbnail…

Earthquake Map

This map visualizes global earthquakes using D3.js, plotting each event as a colored circle on a dark equirectangular projection. Circle size and color encode earthquake magnitude, with the data sourced from a CSV file of USGS earthquake records. The map employs an SVG rendering and includes a polar fisheye distortion effect, initially centered on Japan, that magnifies the map around the cursor's position. The fisheye implementation uses D3’s projection and custom fisheye.js, with event handling throttled for performance.

PPhilippe Rivière

64% match

Loading thumbnail…

Easy earthquakes

A user’s geolocation triggers a real-time map animation of earthquakes, shown as expanding colored circles on a dark Mercator projection of world borders. The visualization pulls geographic data from CartoDB via SQL queries, using `cartodb.SQL` to fetch user locations and map features, while D3.js renders SVG paths and animated circles. Circle color encodes earthquake category through a logarithmic scale, and each pulse expands and fades over two seconds before repeating, with zoom and pan supported via `d3.behavior.zoom`.

Aandrewxhill

64% match