React-native: как показать всплывающую подсказку, не нажимая на маркер в react-native-maps

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

Но теперь я хочу показать всплывающую подсказку, не нажимая на маркер, когда карта загружается изначально.

это мой код здесь:

<View style={styles.page}>
        <MapView
          ref="map"
          style={styles.map}
          region={this.state.region}
          provider = {PROVIDER_DEFAULT}
          zoomEnabled={true}
          onRegionChange={this.onRegionChange.bind(this)}
          pitchEnabled={true}
          showsCompass={true}
          liteMode={false}
          showsBuildings={true}
          showsTraffic={true}
          showsIndoors={true}
        >
        <MapView.Marker
      coordinate={this.state.marker.latlng}
      title={this.state.marker.title}
      description={this.state.marker.description}
      image={require('./assets/pin.png')}

    />

        </MapView>
      </View>

Может ли кто-нибудь помочь, как решить это...


react-native react-native-maps
person Lavaraju    schedule 25.02.2017    source источник

Ответы (1)


arrow_upward
9
arrow_downward

Я не смог найти никакой документации по какой-либо поддержке onLoad для MapView, поэтому вместо этого я использовал onLayout как предложено здесь. Вам нужно будет использовать метод showCallout для маркера, чтобы показать всплывающую подсказку. Для этого добавьте ссылку на маркер, который затем можно будет использовать в onLayout для MapView.

<View style={styles.page}>
    <MapView
        ref="map"
        style={styles.map}
        region={this.state.region}
        provider = {PROVIDER_DEFAULT}
        zoomEnabled={true}
        onRegionChange={this.onRegionChange.bind(this)}
        pitchEnabled={true}
        showsCompass={true}
        liteMode={false}
        showsBuildings={true}
        showsTraffic={true}
        showsIndoors={true}
        onLayout={() => { this.mark.showCallout(); }}
    >
        <MapView.Marker
            ref={ref => { this.mark = ref; }}
            coordinate={this.state.marker.latlng}
            title={this.state.marker.title}
            description={this.state.marker.description}
            image={require('./assets/pin.png')}
        />
    </MapView>
</View>
person Michael Cheng    schedule 25.02.2017
comment
Здравствуйте, спасибо за ваш ответ, я использую ваш модифицированный код, но у меня есть небольшая ошибка. как я могу написать функцию onLayout(), вы можете мне предложить - person Lavaraju; 01.03.2017
comment
@Lavaraju Какую ошибку вы получаете? Код примера должен работать как есть, так как я проверил его перед публикацией. - person Michael Cheng; 03.03.2017
comment
Ошибка: не удается найти функцию layout() - person Lavaraju; 08.03.2017
comment
@Lavaraju Вы имеете в виду onLayout? Метод должен быть onLayout (с учетом регистра), а не layout. - person Michael Cheng; 08.03.2017
comment
Да, но я не получил - person Lavaraju; 09.03.2017
comment
@Lavaraju Можете ли вы показать мне, как выглядит ваш код MapView и MapView.Marker? Или покажите мне точную ошибку, которую вы получаете? Вы можете опубликовать его в Интернете в таком месте, как pastebin. Только так я смогу понять, что ты делаешь не так. - person Michael Cheng; 11.03.2017
comment
@MichaelCheng onLayout, похоже, звонят слишком рано. Выноска не отображается, по крайней мере, на iOS. В качестве обходного пути я использую onRegionChangeComplete, но он немного глючит (опять же, на iOS). - person Viktor Sec; 11.05.2017