Jorge Sanz jsanz

Hackarto.js · City Finder

Small geography game using CARTO.js v4

Author:

Jorge Sanz
Dani Carrión

Improved version (post Hackarto.js) here

Comparing basemaps

A Pen by Jorge on CodePen.

License.

Steps to create a synchronized table in CARTO that queries OSM for specific data.

Navigate to Overpass Turbo web interface and put on the map on the right the area you wnat to query
You can use the wizard or simply put this code and adapt it to your desired tags. Use the Map Features page from the OSM wiki to look for your desired tags.

[out:xml][timeout:25];
(
  node["amenity"="school"]({{bbox}});
);

Text by Álvaro Arredondo

You can do it in the URL, but it's a little bit tricky. When you move the view in an embed, you'll see the URL changes. The thing is, that URL is encoded, but is actually showing a bounding box (NE and SW coordinates). This is the structure:

https://{{map_url}}/embed?state={"map":{"ne":[x, y],"sw":[x, y]}}

Let's take your URL:

Doesn't throw errors, nor does it enable the intended functionality. Question is not what's specifically wrong with this script, but how do we debug these requests that ping the CARTO server but don't seem to return errors.

When you need to load a Torque layer along with other CARTO normal layers (Mapnik type) you need to call createLayer twice and load them into the map in the correct order.

CARTO: Aggregating data on SQL and infowindows

Example on how to aggregate data using spatial SQL and then show the also attributes on CARTO BUILDER infowindow.

Based on a sample dataset with images I will first reduce the geographical precission so they collide into a grid. After that using the json_agg function we join the urls into a single field along with the counts.

WITH data as (

On this simple carto.js example we add a custom infowindow using Mustache and bind to its model an event when the change:visibility property changes.

Open the console for the Hi! and Bye! messages when showing and closing an infowindow.

Query to produce a series of rings using buffers:

First you get a generate_series with the number of rings you want to produce
Then produce the 80km buffers multiplying by the radius for a number of cities
Finally use the lag function to remove for every ring the previous one so you get the ring

	with
	-- dump the geometries
	dumps as (
	select cartodb_id,
	st_dumppoints(the_geom) as dp
	from ne_50m_rivers_lake_centerlines
	),
	-- get the points
	points as (
	select cartodb_id,