react-native-open-maps

🗺 Open up the corresponding device map (Google or Apple Maps) from a set of coordinates (latitude & longitude)

Features

• ✅ Open the map coordinates immediately
• ✅ Create a delayed invoked function that will open the map
• ✅ Create a string of the map link

Usage

1. Install the repository

   $ npm install --save react-native-open-maps

2. Add an import to the top of your file

   import openMap from 'react-native-open-maps';

3. Put it all together

   import React, { Component } from 'react';
   import { Button } from 'react-native';
   import openMap from 'react-native-open-maps';
   
   export default class App extends Component {
     _goToYosemite() {
       openMap({ latitude: 37.865101, longitude: -119.538330 });
     }
     
     render() {
       return (
         <Button
           color={'#bdc3c7'}
           onPress={this._goToYosemite}
           title="Click To Open Maps 🗺" />
       );
     }
   }

4. BONUS: You can also create delayed functions for more of that 1 - 1 mapping flavor 🍦.

import { createOpenLink } from 'react-native-open-maps';

const yosemite = { latitude: 37.865101, longitude: -119.538330 };
const openYosemite = createOpenLink(yosemite);
const openYosemiteZoomedOut = createOpenLink({ ...yosemite, zoom: 30 });

const facebookHQ = { latitude: 37.4847, longitude: 122.1477 };
const openFacebookHQ = createOpenLink(facebookHQ);

// Condensed for Readability...
    render() {
        return (
          <Button
            color={'#bdc3c7'}
            onPress={openYosemite}
            title="Go to Yosemite 🏔" />
          <Button
            color={'#bdc3c7'}
            onPress={openFacebookHQ}
            title="Go to Facebook HQ 🕋" />
        );

API

default function open(options)

react-native-open-maps immediately opens the map of the coordinates and the settings

{ createOpenLink(options) }

Creates a delayed invoked function to open the map. This is useful for binding functions to onPress() in a succinct manner. Think of it like ... function openToMe() { open(coordinates) }

{ createMapLink(options) }

Creates the raw link for the map.

options

🔑 Italicize indicates optional

Properties	Type	Description	Example
latitude	number	The latitude	37.865101
longitude	number	The longitude	-119.538330
zoom	number	The zoom level	18 Default: 15
provider	string (google OR apple)	Overrides the corresponding map provider with the set provider	apple

License

MIT © Brandon Him