React 네이티브 반응 네이티브지도 Mapview가 표시되지 않습니다.

airbnb의 반응 네이티브지도를 사용하려고하지만 맵이 시뮬레이터에 표시되지 않습니다. 내 코드는 문제를 해결 한 다른 코드와 같지만 시뮬레이터는 빨간색 테두리가있는 빈 흰색 화면입니다. Mapview는 작동하지만 airbnb의 버전을 사용하고 싶습니다.React 네이티브 반응 네이티브지도 Mapview가 표시되지 않습니다.

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import MapView from 'react-native-maps'; 

export default class Haulr extends Component { 
    render() { 
    return (
    <MapView 
     initialRegion={{ 
     latitude: 37.78825, 
     longitude: -122.4324, 
     latitudeDelta: 0.0922, 
     longitudeDelta: 0.0421, 
     }} 
    /> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
    instructions: { 
    textAlign: 'center', 
    color: '#333333', 
    marginBottom: 5, 
    }, 
    map: { 
    position: 'absolute', 
    top: 0, 
    left: 0, 
    right: 0, 
    bottom: 0, 
    }, 
}); 

AppRegistry.registerComponent('Haulr',() => Haulr);

출처

2016-12-17 Conor Burke

iOS 또는 Android? – Vkrm

이 문제를 해결할 수 있었습니까? 현재 같은 문제가 있습니다. ( –

찾았 음. https://medium.com/@suchydan/how-to-solve-google-play-services-version-collision-in-gradle-dependencies-ef086ae5c75f –

당신은 MapView에 styles를 추가하는 것을 잊었다 :

<MapView 

    style={styles.map} 

    initialRegion={{ 
    latitude: 37.78825, 
    longitude: -122.4324, 
    latitudeDelta: 0.0922, 
    longitudeDelta: 0.0421, 
    }} 
/>

당신의 스타일을 정의하는 것을 잊지 마세요 :

const styles = StyleSheet.create({ 
    map: { 
    ...StyleSheet.absoluteFillObject, 
    },

});

mapView가 작동하려면 MapView의 스타일을 위쪽, 왼쪽, 오른쪽 및 아래쪽 값이 설정된 절대 위치로 설정해야합니다. 명시된 바와 같이 in the repo

출처

2016-12-17 07:38:13

나에게 도움이된다 어떤 이유로 든 빨간색 테두리가있는 흰 화면이 생기면 –

코드를 공유 할 수 있습니까? + 어떤 플랫폼을 사용하고 있습니까? PS : 다시 한번 질문하는 것이 더 좋을 수도 있습니다. –

이것은 나를 위해 일했습니다. . – NSCoder

-1

공백 맵 주위에 빨간색 경계가있는 상자가 나타나는 이유는 package.json에서 매우 그렇기 때문에 버전> = 0.12.4 및 NOT^0.12.4를 지정해야합니다. 0.12.4와 호환됨을 의미). 그래서, 그런

"dependencies": { 
    "react": "15.4.2", 
    "react-native": "0.41.2", 
    "react-native-maps": ">=0.12.4", 
    .... 
},

에

"dependencies": { 
    "react": "15.4.2", 
    "react-native": "0.41.2", 
    "react-native-maps": "^0.12.4", 
    .... 
},

에서 dependencies 섹션과 변화를 찾아 다음 명령을 실행

$ npm update 
$ react-native link 
$ cd ios 
$ touch Podfile

복사하고 Podfile에 sample Podfile를 붙여 넣습니다. 대상을 변경하고 파일을 저장하십시오. 그런 다음

$ pod install

를 실행 당신은 또한 당신의지도보기에 스타일 속성을 추가 할 수 있습니다

<MapView style={styles.map} 
    initialRegion={{ 
    ... 
    }} 
/>

신용이 게시물 Fuck the red borders of react-native-maps by AirBnb

출처

2017-03-12 20:07:22

-1

나는이 문제를 가지고 있었다

에 가서 내가했던 일은이었다 프로젝트를 다시 컴파일하십시오. 일단 내가 그랬 으면 빨간 테두리가 사라졌고 나는 렌더링 할지도를 얻었다.

출처

2017-05-31 19:04:47 chapeljuice

React 네이티브 반응 네이티브지도 Mapview가 표시되지 않습니다.

답변

관련 문제