MapBoxGL flyTo无法正常运作-无法识别

因此,我想制作一个RectButton,当按下该按钮时,它将执行将相机发送到特定坐标的函数(onFlyToPress())。但是每次我使用flyTo函数时,都会向我返回一个异常,指出该函数无法识别/相机不是对象。

import React,{ Component } from 'react';
import { StyleSheet,View,Image,Text } from 'react-native';
import MapboxGL from '@react-native-mapbox-gl/maps';
import { PermissionsAndroid } from 'react-native';
import tabbarConfigs from '../appColorElements.json'; // arquivo que controla toda a estrutura da tabbar
import { RectButton } from 'react-native-gesture-handler';

export default class Principal extends Component {
  state = {
    position: [50,50],styleURL: 'mapbox://styles/qun4ntumt/ck390137d3lta1dnvs5u9428r',};

  onFlyToPress() {
    this.map.flyTo([-122.400021,37.789085],6000);
  }

  render() {
    return (
      <View style={styles.container}>
        <MapboxGL.MapView
          style={styles.map}
          styleURL={tabbarConfigs.colorElements.mapa.cor}
          rotateEnabled={false}
          animated={true}
          logoEnabled={false}
          compassEnabled={false}
          attributionEnabled={false}
          debugactivex>
          <MapboxGL.Camera
            zoomLevel={16}
            centerCoordinate={this.state.position}
            maxzoomLevel={16}
          />
          <MapboxGL.UserLocation />
        </MapboxGL.MapView>
        <RectButton
          style={styles.btnCentralizer}
          onPress={() => {
            this.onFlyToPress();
          }}>
          <Localicon
            height={20}
            width={20}
            fill={tabbarConfigs.colorElements.paletaApp.cinza}
            style={{ alignSelf: 'center' }}
          />
        </RectButton>
      </View>
    );
  }
}

fwangeling 回答:MapBoxGL flyTo无法正常运作-无法识别

我有同样的问题。代替flyTo(),我通过使用setState({centerCoordinates})代替flyTo()直接更新了Camera的中心坐标。

<MapboxGL.Camera
    zoomLevel={15}
    animationMode={'flyTo'}
    animationDuration={3000}
    centerCoordinate={this.state.centerCoordinate}
/>

希望这会有所帮助。

本文链接:https://www.f2er.com/2982485.html

大家都在问