npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-native-steerpath-smart-map

v1.29.4

Published

Steerpath SmartMapView for React Native

Downloads

269

Readme

react-native-steerpath-smart-map

Getting started

$ npm install react-native-steerpath-smart-map --save

or

$ yarn add react-native-steerpath-smart-map

Example app

here

Mostly automatic installation

We only support Cocoapod linking for iOS at the moment

For iOS

In your ios/Podfile, add the following lines to the top it:

source 'https://github.com/CocoaPods/Specs.git'
source 'https://bitbucket.org/nimbledevices/steerpath-mapbox-ios-podspec.git'
source 'https://bitbucket.org/nimbledevices/steerpath-smart-sdk-podspec.git'

Run:

$ pod install

For Android

In your android/app/build.gradle, add the following lines before the dependencies {} block:

repositories {
    // For Steerpath Smart Map SDK
    maven { url "https://android-sdk.steerpath.net" }
}

If you are using React-Native < 0.60: $ react-native link react-native-steerpath-smart-map

Run the example app

$ cd example
$ yarn install --force
$ cd ios
$ pod update
$ cd ..
$ react-native run-ios # for ios
$ react-native run-android # for android

Usage

import {
  SmartMapView,
  SmartMapManager,
} from "react-native-steerpath-smart-map";
const API_KEY = "...";

SmartMapManager.start(API_KEY);

<SmartMapView
  style={{ flex: 1 }}
  apiKey={API_KEY} // This is required only if you are using this component in the web
/>;

Using configuration file (optional)

General naming for the configuration file is steerpath_config.json. If your Smart SDK Api Key requires other naming, name your configuration file according to that. There are two options of how to use config file:

  1. Add configuration file to your react native project folder and use startWithConfig(iOS/Android) or start(web) method of SmartMapMananger. See config.js and App.tsx or App.web.tsx of our example application.

  2. Add a configuration file to your project. See platform specific instructions below.

Android:

Add configuration file to /src/main/assets folder of your Android project.

iOS

Add configuration file to your Xcode project and select your application target

Web

Add config file to your project and export it from there to the component where the SmartMapManager.start() is initialised. You can pass the config file as the second parameter to the start() method as a string. Below is the TypeScript snippet from the example project:

(SmartMapManager as { start: (apiKey: string, config: Record<string, unknown>) => void }).start(
  API_KEY,
  JSON.parse(CONFIG_STRING),
);

Using offline bundle (Optional)

OfflineBundle (.sff) is a package containing indoor map tiles, (world tiles excluded), map style, routing data, positioning data and map object meta data. With OfflineBundle, maps & indoor positioning works without network connection.

Android

Steps to enable OfflineBundle

  1. Copy provided .sff file into your application project's /assets folder
  2. Add following flag to your app's Manifest.xml:
<meta-data android:name="SP_OFFLINE_DATA" android:value="theNameOfYourOffineBundle.sff"/>

iOS

The offline bundle should have “.sff” extension. Rename it to “sp_offline_data.sff” and drag it to your Xcode project. Select “Copy items if needed” and select your application target.

The default offline data file name is “sp_offline_data.sff”. If you want to use a custom name, you can add the following key to your application’s Info.plist (Please make sure that the offline data file name matches):

<key>SP_OFFLINE_DATA</key>
<string>sp_offline_data.sff</string>

iOS trouble shooting

  • For the error whe doing pod install on /example folder
Error

Errno::ENOENT - No such file or directory @ realpath_rec - .../react-native-steerpath-smartmap/example/node_modules/react-native-steerpath-smart-map/node_modules

Run cd example && yarn add react-native-steerpath-smart-map --force --ignore-scripts. The node_modules should re-appear

Web

Using the offline bundle with react-native-steerpath-smartmap package on web platform is not yet supported. You can use the example of Steerpath Core SDK found in the Offline bundle ./style folder to view maps.

Documentation

For Steerpath Developer

Publishing a new version:

  • For development

For the first time: Run yarn install && yarn build in the root project, then go to example and run yarn install again.

Everytime making changes in the root project, run yarn build again and go to example project and yarn add react-native-steerpath-smart-map --force to see the changes in the example project. Make any changes to the example project if necessary.

  • For releasing

Run the Typescript compiler and then npm publish:

$ yarn build
$ yarn publish