{"id":23,"date":"2023-01-24T21:29:59","date_gmt":"2023-01-24T21:29:59","guid":{"rendered":"https:\/\/blogs.oregonstate.edu\/schaefkr\/?p=23"},"modified":"2023-01-24T21:30:33","modified_gmt":"2023-01-24T21:30:33","slug":"2-alternatives-to-google-maps-for-integrating-maps-into-your-application","status":"publish","type":"post","link":"https:\/\/blogs.oregonstate.edu\/schaefkr\/2023\/01\/24\/2-alternatives-to-google-maps-for-integrating-maps-into-your-application\/","title":{"rendered":"2 Alternatives to Google Maps for Integrating Maps into Your Mobile Application"},"content":{"rendered":"\n

<\/p>\n\n\n\n

Currently my team is working on developing a mobile app for bike sharing for our OSU CS Capstone project. None of the team members have experience using a Map API so we spent a bit of time researching what options are out there. Although Google Maps has great maps APIs, we wanted to explore some alternative options. Here are 2 great Javascript libraries we found – each offering a range of features at an affordable price. <\/p>\n\n\n\n

\"\"
Image by
Tamas Tuzes-Katai – Unsplash<\/a><\/figcaption><\/figure>\n\n\n\n

<\/p>\n\n\n\n

Mapbox GL JS<\/h2>\n\n\n\n

https:\/\/docs.mapbox.com\/mapbox-gl-js\/api\/map\/<\/a><\/p>\n\n\n\n

Mapbox is a powerhouse for their Maps and Navigation APIs. Their Mapbox GL JS library is a standout. According to Mapbox<\/a>, “Mapbox GL JS is a JavaScript library for vector maps on the Web. Its performance, real-time styling, and interactivity features set the bar for anyone building fast, immersive maps on the web.”<\/em><\/p>\n\n\n\n

To get started you just need to create a Map object by specifying the map bounds and a few other options. You can then utilize a multitude of interactive features such as allowing the user to drag and pan or rotate the map. Oh, and did I mention it’s possible to use 3d maps! Here’s a full list of features<\/a> to check out. Below are some examples of different maps that are possible with Mapbox GL JS. <\/p>\n\n\n\n

\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"
Images Courtesy of Mapbox<\/a><\/figcaption><\/figure>\n<\/figure>\n\n\n\n

The pricing<\/a> of Mapbox GL JS is affordable, if not free for small applications with less than 50,000 monthly loads. For applications with higher demand, 1,000,000 loads or less will run $3.00. Alternatively, 3 seats for web come at no cost. For larger development teams, 20 seats runs $68\/month and 100 seats is $388\/month.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n
\"\"
Images courtesy of https:\/\/www.mapbox.com\/pricing<\/a><\/figcaption><\/figure>\n\n\n\n

To get started with Mapbox GL JS<\/strong> check out these tutorials<\/strong>: <\/p>\n\n\n\n

How to Build a Store Locator Using Mapbox GL JS<\/a><\/p>\n\n\n\n

\"\"
Image Courtesy of TheProgrammableWeb<\/a><\/figcaption><\/figure>\n\n\n\n

Mapbox GL JS + React<\/a><\/p>\n\n\n\n

\"\"
Image courtesy of Tristen Brown – Mapbox<\/a><\/figcaption><\/figure>\n\n\n\n

Getting Started with Mapbox GL JS Part I<\/a><\/p>\n\n\n\n

\n