mapbox-concatenate-workshop

KO | EN

gitlite — search

#python #react #golang #linux #java #windows #awesome #kubernetes #vue #security #pytorch #ios #openai #open-source

mapbox-concatenate-workshop

(★ 19)

Building Interactive Maps with Mapbox, Concatenate Conf 2019

mapbox-concatenate-workshop Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Building Interactive Maps with Mapbox

Workshop @ [Concatenate Lagos 2019](http://concatenate.dev)

[Anjana Vakil](https://twitter.com/AnjanaVakil), Software Engineer @ [Mapbox](https://www.mapbox.com)

## Overview

Location data is all around us, and has become an increasingly important component of web & mobile apps users love. In this hands-on workshop, we'll learn how to build an interactive, custom web map using open data and free, open-source tools from Mapbox. Through a hands-on project, we will cover basic web mapping concepts and tools, including:
- Creating & editing map data
- Editing & styling maps with Mapbox Studio, an online map data & design tool for creating beautiful custom map styles
- Developing map applications with Mapbox GL JS, an open-source JS library for fast, interactive, WebGL-driven maps

### Goals

By completing this workshop you'll learn how to:
- Create a custom dataset with the Studio dataset editor
- Include your data in a map style & customize the map's design with the Studio style editor
- Add your custom map to a web page with Mapbox GL JS
- Make your web map interactive with event handlers
- Create a "scrollytelling" map from your own data & style

### Prerequisites

No prior experience with geographic data or web mapping is required; basic familiarity with HTML & JS will be assumed but everyone is welcome.

### What you'll need

- Laptop with browser (Chrome or Firefox preferred) & text editor of your choice
- Free Mapbox account - sign up at [bit.ly/mapbox-concatenate-signup](https://bit.ly/mapbox-concatenate-signup)
- The workshop materials - fork or download this repository from [github.com/vakila/mapbox-concatenate-workshop](https://github.com/vakila/mapbox-concatenate-workshop)

### Materials

- [Slides](https://docs.google.com/presentation/d/1_SHifQ2zipxfwsRNkbzcQ2N39wCBgzKU4BFpDM6MNuc/edit?usp=sharing)
- Instructions & code examples in [this repository](https://github.com/vakila/mapbox-concatenate-workshop)

## Contents

### [Part 1: Data](part-1.md)

### [Part 2: Style](part-2.md)

### [Part 3: Display](part-3.md)

### [Part 4: Interactivity](part-4.md)

### [Part 5: Creativity](part-5.md)

## After this workshop

### [Optional] Publish your maps on Github Pages

If you forked the workshop repo on Github, you can use [Github Pages](https://pages.github.com/) to publish your maps right now!

- Commit any changes you made to **your fork** of the repository:
  ```
  $ git add .
  $ git commit -m "add my awesome maps"
  ```
- Create a new branch called `gh-pages` and push it to **your fork** on Github
  ```
  $ git checkout -b gh-pages
  $ git push -u origin gh-pages
  ```
- Wait a few minutes, and your maps will be published at `https://<your-username>.github.io/mapbox-concatenate-workshop/...`!

### Share what you #builtwithmapbox
We'd love to see whatever you build! Share on Twitter with the [`#builtwithmapbox`](https://twitter.com/hashtag/builtwithmapbox) hashtag so that we can amplify your work!

### Learn more about maps
We've only scratched the surface of what maps & Mapbox tools can do!

For more information & ideas, check out:
- The Mapbox [Documentation](https://docs.mapbox.com), including [Help](https://docs.mapbox.com/help/) and [Tutorials](https://docs.mapbox.com/help/tutorials)
- [Documentation](https://docs.mapbox.com/mapbox-gl-js/api/) & [Examples](https://docs.mapbox.com/mapbox-gl-js/examples/) for [mapbox-gl-js](https://github.com/mapbox/mapbox-gl-js)
- [The Mapbox Studio Manual](https://docs.mapbox.com/studio-manual/)

### Stay in touch

Keep up with [@Mapbox](https://twitter.com/mapbox) and [@AnjanaVakil](https://twitter.com/anjanavakil) on Twitter, and [contact Mapbox](https://www.mapbox.com/contact/) if you need any help with our tools.

## Thank you

This workshop would not have been possible without:
- The amazing Concatenate Conf organizers, especially Christian Nwamba, Gift Egwuenu, and Sarah Drasner
- My fabulous colleagues at Mapbox, especially Mikel Maron, Marena Brinkhurst, and John Branigan

mapbox-concatenate-workshop

mapbox-concatenate-workshop Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

mapbox-concatenate-workshop

mapbox-concatenate-workshop Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README