ArcGIS官方提供了 JavaScript SDK,也提供了 ArcGIS-Runtime-SDK-iOS,但是并没有提供 React Native的版本,所以这里使用了 react-native-arcgis-mapview 库,这个库比较老,支持的 ArcGIS-Runtime-SDK-iOS 版本是100.4,但是在使用的时候发现,在使用pod install安装的时候总是会下载失败,所以后面手动将 ArcGIS-Runtime-SDK-iOS 的版本改为 100.14.1。
npx react-native init MyReactNativeApp
cd MyReactNativeApp/ios
pod install
cd MyReactNativeApp
npm install react-native-arcgis-mapview
pod 'RNArcGISMapView', :path => "../node_modules/react-native-arcgis-mapview/ios"
s.dependency 'ArcGIS-Runtime-SDK-iOS', '100.4'
=>
s.dependency 'ArcGIS-Runtime-SDK-iOS', '100.14.1'
cd MyReactNativeApp/ios
pod install
import React, {useRef, useState}from 'react'
import {View, Text, Button, StyleSheet } from 'react-native'
import ArcGISMapView, { setLicenseKey } from 'react-native-arcgis-mapview'
function App() {
const key = '<key>'
setLicenseKey(key)
const mapView = useRef(null)
const basemap = 'https://www.arcgis.com/home/item.html?id=6b6b9cea06964cb38d8a654964c347ab'
return (
<View style={styles.container}>
<ArcGISMapView
style={styles.map}
initialMapCenter={[{latitude: 32.788, longitude: -79.940, scale: 10000.0}]}
basemapUrl={basemap}
ref={mapView}
/>
<Button title="Test" onPress={() => {
console.log(mapView.current.props.basemapUrl)
}} />
</View>
);
}
var styles = StyleSheet.create({
container: {
flex: 1,
},
map: {
flex: 1,
},
})
export default App
npm start