Question

我按照air-bnb安装指南说明了步骤并创建了容器。我在容器底部看到一个谷歌徽标，这意味着我的初始化步骤是正确的，但地图内容没有加载。我在我的清单中包含了api密钥：

<meta-data
     android:name="com.google.android.geo.API_KEY"
     android:value="mydummmmmmmmmmyApiKeyyyyyyyyyyyyyyyyyyy"/>

它甚至是正确的吗？该文件似乎说要把它放在两个括号之间：

<meta-data
         android:name="com.google.android.geo.API_KEY"
         android:value="{{mydummmmmmmmmmyApiKeyyyyyyyyyyyyyyyyyyy}}"/>

我试过了两次并且没有成功。

修改：已解决

重新启动后地图显示

使用api密钥的正确方法是将其包含在清单

中

<meta-data
             android:name="com.google.android.geo.API_KEY"
             android:value="mydummmmmmmmmmyApiKeyyyyyyyyyyyyyyyyyyy"/>

Answer 1

If you have a blank map issue, (#118, #176) try the following lines :

Set this Stylesheet in your map component

...
const styles = StyleSheet.create({
 container: {
   ...StyleSheet.absoluteFillObject,
   height: 400,
   width: 400,
   justifyContent: 'flex-end',
   alignItems: 'center',
 },
 map: {
   ...StyleSheet.absoluteFillObject,
 },
});

module.exports = class MyApp extends React.Component {
 render() {
   const { region } = this.props;
   console.log(region);

   return (
     <View style ={styles.container}>
       <MapView
         style={styles.map}
         region={{
           latitude: 37.78825,
           longitude: -122.4324,
           latitudeDelta: 0.015,
           longitudeDelta: 0.0121,
         }}
       >
       </MapView>
     </View>
   );
 }
}
Run "android" and make sure every packages is updated.
If not installed yet, you have to install the following packages :
Extras / Google Play services
Extras / Google Repository
Android 6.0 (API 23) / Google APIs Intel x86 Atom System Image Rev. 13
Check manual installation steps
Generate your SHA1 key :
keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android

Go to Google API Console and select your project, or create one.
In Overview -> Google Maps API -> Google Maps Android API -> Check if it's enabled
Create a new key by clicking on Create credentials -> API Key -> Android Key, enter the name of the API key and your SHA1 key, generated before, and create it. Check installation step 4.

Clean the cache :
watchman watch-del-all
npm cache clean

When starting emulator, make sure you have enabled Wipe user data.

Run react-native run-android

At this step it should work, but if not, go to your Google API Console and create a Browser key instead of a Android key and go to step 6.

在Android上反应原生地图

1 个答案: