Как я устанавливаю маркеры в React Native Mapview

Я использую react-native-maps, у меня отображается карта, а также моя текущая широта и долгота, но я не знаю, как показать маркер на карте с широтой и долготой.

Код для lat и long:

callLocation(that){
navigator.geolocation.getCurrentPosition(
   (position) => {
      const currentLongitude = position.coords.longitude;
      const currentLatitude = position.coords.latitude;
      that.setState({ currentLongitude:currentLongitude });
      that.setState({ currentLatitude:currentLatitude });
   },
   (error) => alert(error.message),
   { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
);
that.watchID = navigator.geolocation.watchPosition((position) => {
    console.info(position);
    const currentLongitude = position.coords.longitude;
    const currentLatitude =  position.coords.latitude;
   that.setState({ currentLongitude:currentLongitude });
   that.setState({ currentLatitude:currentLatitude });
});}

Код для карты:

<View style = {styles.container}>
    <MapView
      style = {styles.map}
      initialRegion = {{
        latitude:  this.state.currentLatitude,
        longitude: this.state.currentLongitude,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421,
      }}>
    </MapView>
  </View>

javascript reactjs google-maps react-native react-native-maps

13.03.2019 08:33

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

4 103

Ответы 2

Вы должны использовать компонент Marker.

Пример:

import { MapView, Marker } from 'react-native-maps';

<MapView
  style = {styles.map}
  initialRegion = {{
    latitude:  this.state.currentLatitude,
    longitude: this.state.currentLongitude,
    latitudeDelta: 0.0922,
    longitudeDelta: 0.0421,
  }}
>
  <Marker
    coordinate = {{latitude: 40.741075, longitude: 74.0003317}}
    title = {'title'}
    description = {'description'}
  />
</MapView>

13.03.2019 08:39

Рабочий пример:

<MapView provider = {Platform.OS === 'android' ? PROVIDER_GOOGLE : PROVIDER_DEFAULT}  // remove if not using Google Maps
 style = {{width: '100%', height: FULL_SH*0.51, marginTop: 65*SH}}
  initialRegion = {{
     latitude: this.state.myLat ? this.state.myLat : 38.4555,
     longitude: this.state.myLon ? this.state.myLon : 27.1199,
     latitudeDelta: 0.015,
     longitudeDelta: 0.0121}}>
    <MapView.Marker
       coordinate = {{latitude: 38.4555, longitude: 27.1199}}
       title = {'Deneme'}
     />
    <MapView.Marker
       onPress = {() => this.setState({visible: true}) + setTimeout(() => alert(this.state.visible), 200)}
       description = {'güzel mekan'}
       coordinate = {{latitude: 38.4555, longitude: 27.1129}}
       title = {'Deneme'}/>
</MapView>

Я использую ваш код, но он показывает мне ошибку «TypeError: undefined не является объектом (оценка '_reactNativeMaps.MapView.Marker)»

— 13.03.2019 09:41

Может у вас старая версия? Не знаю, пользуюсь без проблем.

— 13.03.2019 12:23

13.03.2019 08:39