Gist 4495761

100%

✓ Published0🌍 Public

Last edited Jan 9, 2013

Created on Jan 9, 2013

This interactive map displays global cities, filtered by categories such as all locations, national capitals, and megacities. Users select a filter via buttons in the top-right menu, which dynamically updates the displayed points. The visualization uses the CartoDB library to create and manage layers over a Leaflet map, with a dark MapBox tile layer as the base. Point styling is defined through CartoDB’s tile style syntax, and SQL queries on the underlying dataset change the visible features per selection.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 4503902

This map shows global cities categorized by type, with buttons to filter between all populated places, national capitals, and megacities. It overlays a second data layer that can be toggled via the same menu, though the code only reveals it on button click without a corresponding hide action. The visualization uses the CartoDB.js library to load tile layers and vector data from CartoDB’s viz.json API, with Leaflet handling the map interaction and tile display. Styling applies custom marker properties for red fill, white outlines, and overlap allowance, while CSS fades are disabled for smoother layer transitions.

Aandrewxhill

92% match

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

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

72% match

Loading thumbnail…

Gist 5830532

This example displays a map with a set of geographic features loaded from a CartoDB SQL query, which returns data in GeoJSON format. The visualization uses the Leaflet mapping library to render the map and a `L.geoJson` layer to draw the features. Each feature is processed with an `onEachFeature` callback that assigns a `cartodb_id` property to the corresponding Leaflet layer and adds it to a `drawnItems` layer group, which is then added to the map. The data source is the `leaflet_data` table from the osm2 CartoDB account.

Aandrewxhill

72% match

Loading thumbnail…

Gist 894879

This example builds an interactive map visualization using the D3.js library, displaying geographic data over a rendered world map. It applies a force-directed simulation with `d3.forceSimulation` to position nodes, while `d3.geoPath` generates the map outlines and `d3.geoProjection` handles coordinate transformations. The interface includes customizable control panels styled via CSS, allowing users to adjust map layers and layout dynamically. The visualization renders data from a gist source, combining geographic boundaries with overlaid points that respond to simulated forces for a dynamic, data-driven presentation.

Aandrewxhill

71% match

Loading thumbnail…

Gist 9378741

This interactive interface guides users through geocoding tabular data, first classifying location columns by type—city names, postal codes, IP addresses, or street addresses—then offering point or polygon output options. After georeferencing, it displays result summaries with success counts, failure explanations, and cost feedback, including free and paid quota messaging. The example uses CartoDB’s geocoding API and a dynamic form interface, with state-driven prompts and dropdowns to collect necessary country or region details before triggering the geocoding process.

Aandrewxhill

70% match

Loading thumbnail…

Gist 8393709

This visualization displays a world map rendered from GeoJSON data using D3.js, with country polygons colored according to a categorical scale. The map focuses on named regions and includes a legend and hover interactions, allowing viewers to explore geographic boundaries and associated metadata such as country names and people listed in the properties.

Aadkatrit

70% match

Loading thumbnail…

Gist 3163949

This visualization maps development projects and their work areas as geographic points, connected by curved links to the responsible agencies. It displays project details, budgets, and topic classifications, with agency positions marked as separate nodes. The map uses CartoDB’s SQL API to query project, solution, agency, and topic tables, then renders GeoJSON geometries through D3’s `d3.geoPath`. Node positions are computed via `d3.forceSimulation`, while centroids for work-area polygons are calculated with PostGIS functions (`ST_Centroid`, `ST_X`, `ST_Y`).

Aandrewxhill

70% match