Martin Raifer tyrasd

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

Interactive version of the Bikeability Index map of Graz made by Patricia Jasmin Krenn, Pekka Oja and Sylvia Titze: Development of a Bikeability Index to Assess the Bicycle-Friendliness of Urban Environments (CC-BY 4.0)

Pan and zoom in the map on the left to rotate the globe.

Click and drag the globe to pan on the map.

An example that shows a Chiasm plugin based on Leaflet.js alongside a Chiasm globe plugin based on the D3 example This is a Globe.

The Chiasm plugins demonstrated here are

	/*
	EXAMPLE MESSAGE

	/poll "question?" "option 1" "option 2"
	*/

	/** Global Helpers
	*
	* console - A normal console instance
	* _ - An underscore instance

	// CSV Output
	[out:csv(name, ::"lat", ::"lon")];
	{{geocodeArea:CH}}->.searchArea;
	// gather results
	(
	// query part for: “place”
	(node["place"]["name"~"^.+$"](area.searchArea);)
	);
	out body;

	<!DOCTYPE html>
	<html>
	<head>
	<script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script>
	<link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' />
	<style>
	body { margin:0; padding:0; }
	#map { position:absolute; top:0; bottom:0; width:100%; }
	</style>
	</head>

	// TODO: longer method name
	Function.prototype.extractBlockCommentAsMultilineString = function() {
	return this.toString().match(/^function \(\)\{\s\/\((?:[^]\|\+[^\/]))\+\/\s\}$/)[1];
	};

	var s = function(){/*
	STRING
	GOES
	HERE
	*/}.extractBlockCommentAsMultilineString();

	// Promise.all is good for executing many promises at once
	Promise.all([
	promise1,
	promise2
	]);

	// Promise.resolve is good for wrapping synchronous code
	Promise.resolve().then(function () {
	if (somethingIsNotRight()) {
	throw new Error("I will be rejected asynchronously!");

	# props: https://stackoverflow.com/questions/3515597/add-only-non-whitespace-changes#answer-7149602
	git diff -U0 -w --no-color \| git apply --cached --ignore-whitespace --unidiff-zero