Cristiano Dalbem cmdalbem

Mapzen's Bike Map (read blog post) uses OpenStreetMap tags and relations to color roads and paths according to their (relative) safely. See legend at right.

The OpenStreetMap tag rendering logic is in the Walkabout repo (view source).

This GIST is a human readable version:

Tier 1a: Dark Green (off-road)

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

~~Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.~~

If you have been playing around with the new Mapbox Studio you might be interested to know how to make a custom map with objects of your own interest from OpenStreetMap.

To make the process of creating an updating an OSM based dataset on Mapbox more seamless, I was looking into a command line based workflow that could extract OSM data from Overpass and update a Mapbox hosted dataset in one go.

Requirements

Generate an Overpass Query

Use Overpass Turbo to create a query for the data you are interested in extracting. Since i'm interested in bus stops, I first browse the map to Bengaluru, India and then generate a query using the wizard query highway=bus_stop

	// Installation:
	// yarn add -D @codemod/cli @babel/plugin-syntax-jsx @babel/generator

	import jsx from "@babel/plugin-syntax-jsx"
	import generate from "@babel/generator"

	const COLOR_MAP = {
	"white": "white",
	"near-white": "gray-100",
	"light-gray": "gray-200",

	<%@include file="/libs/foundation/global.jsp" %>

	<cq:include path="myComponent" resourceType="matelli/components/content/myComponent" />

	<%
	/** Option 1: Simply direct reference */
	//String componentPath = "/content/myPage/jcr:content/myComponent"; //path to component
	//Node node = resourceResolver.getResource(componentPath).adaptTo(Node.class);
	//String title = node.getProperty("jcr:title").getString();
	//String text = node.getProperty("jcr:text").getString();