https://github.com/laoqiu/react-native-amap

react native amap module for android
https://github.com/laoqiu/react-native-amap

Last synced: 6 days ago
JSON representation

react native amap module for android

• Host: GitHub
• URL: https://github.com/laoqiu/react-native-amap
• Owner: laoqiu
• License: mit
• Created: 2016-01-22T03:11:32.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2017-09-15T06:36:10.000Z (about 7 years ago)
• Last Synced: 2024-11-13T04:52:35.316Z (about 1 month ago)
• Language: Java
• Size: 10.6 MB
• Stars: 20
• Watchers: 3
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react-native - react-native-amap ★21 - A React Native component for building maps with the AMap Android SDK (Components / Integrations)
• awesome-react-native - react-native-amap ★21 - A React Native component for building maps with the AMap Android SDK (Components / Integrations)
• awesome-react-native - react-native-amap ★21 - A React Native component for building maps with the AMap Android SDK (Components / Integrations)
• awesome-react-native-ui - react-native-amap ★16 - A React Native component for building maps with the AMap Android SDK (Components / Integrations)
• awesome-react-native - react-native-amap ★21 - A React Native component for building maps with the AMap Android SDK (Components / Integrations)

README

        
# React Native AMap

A React Native component for building maps with the [AMap Android SDK](http://lbs.amap.com/api/android-sdk/summary/).

## Example

```

...

import MapView from 'react-native-amap';

class example extends Component {

  render() {

    return (

      

        

          Welcome to React Native!

        

        

      

    );

  }

}

...

```

![image](example/example.png)

## Install

### Step 1 - NPM install

```

npm install react-native-amap --save

```

### Step 2 - Update Gradle Settings

```

// file: android/settings.gradle

...

include ':reactamap'

project(':reactamap').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-amap')

```

### Step 3 - Update app Gradle Build

```

// file: android/app/build.gradle

...

dependencies {

    ...

    compile project(':reactamap')

}

```

### Step 4 - Register React Package

#### react-native >= v0.18.0

```

import com.laoqiu.amap.AMapReactPackage;

...

   /**

   * A list of packages used by the app. If the app uses additional views

   * or modules besides the default ones, add more packages here.

   */

    @Override

    protected List getPackages() {

      return Arrays.asList(

        new MainReactPackage(),

        new AMapReactPackage()); // <-- Register package here

    }

...

```

#### react-native < v0.18.0

```

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        mReactRootView = new ReactRootView(this);

        mReactInstanceManager = ReactInstanceManager.builder()

        		...

				.addPackage(new AMapReactPackage()) // <-- Register package here

				...

				.build();

		...

```

### Step 5 - Add map permission and api key

```

// file: android/app/src/main/AndroidManifest.xml

	...

	

    

    

    

    

    

    

    

    

    

    

      

   ...

```