react-native-baidu-map-x

• 目前仅支持android
• baidu-map-sdk:4.5.2

导入

• 配置settings.gradle

include ':react-native-baidu-map-x'

project(':react-native-baidu-map-x').projectDir = new File(settingsDir, '../node_modules/react-native-baidu-map-x/android')

• 配置build.gradle(app)

compile project(':react-native-baidu-map-x')

• 配置MainApplication.java

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
            ...
              //add BaiduMapPackage
              new BaiduMapPackage(getApplicationContext())
            ...
      );
    }

• 配置AndroidMainifest.xml -权限

<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>

    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    //读取设备硬件信息，统计数据
    <uses-permission android:name="com.android.launcher.permission.READ_SETTINGS" />
    //读取系统信息，包含系统版本等信息，用作统计
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
    //获取设备的网络状态，鉴权所需网络代理
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    //允许sd卡写权限，需写入地图数据，禁用后无法显示地图
    <uses-permission android:name="android.permission.WRITE_SETTINGS" />
    //获取统计数据
    <uses-permission android:name="android.permission.GET_TASKS" />
    //鉴权所需该权限获取进程列表
    <uses-permission android:name="android.permission.CAMERA" />
    <!-- 这个权限用于进行网络定位-->
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    <!-- 这个权限用于访问GPS定位-->
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

    <!-- 获取运营商信息，用于支持提供运营商信息相关的接口-->
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <!-- 这个权限用于获取wifi的获取权限，wifi信息会用来进行网络定位-->
    <uses-permission android:name="android.permission.CHANGE_WIFI_STATE" />

    <!-- 访问网络，网络定位需要上网-->
    <uses-permission android:name="android.permission.INTERNET" />
    <!-- SD卡读取权限，用户写入离线定位数据-->
    <uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" />

• 配置AndroidMainifest.xml -百度地图key（不添加无法显示地图）

<meta-data android:name="com.baidu.lbsapi.API_KEY" android:value="百度API KEY"/>

• 配置AndroidMainifest.xml -服务(调用导航和定位用)

<service android:name="com.baidu.location.f" android:enabled="true" android:process=":remote"> </service>

使用

import { MapView,ColorTypes,MapTypes, MapModule, Geolocation,Navi,Location } from 'react-native-baidu-map-x'

MapView Props 属性

Name	Type	Default	Extra
zoomControlsVisible	bool	false	Android only
trafficEnabled	bool	false
baiduHeatMapEnabled	bool	false
mapType	number	1
zoom	number	10
center	object	null	{latitude: 0, longitude: 0}
markers	array	[]	[marker, maker]
lines	array	[]
circles	array	[]
onMapStatusChangeStart	func	undefined	Android only
onMapStatusChange	func	undefined
onMapStatusChangeFinish	func	undefined	Android only
onMapLoaded	func	undefined
onMapClick	func	undefined
onMapDoubleClick	func	undefined
onMarkerClick	func	undefined
onMarkerClick	func	undefined
onLineClick	func	undefined

Navi导航 Props 属性

Name	Type	Default	Extra
openBaiduMapNavi	func	undefined

Location定位 Props 属性

Name	Type	Default	Extra
getLocation	promise	undefined