React native 如何使用react native上的MapViewDirections使地图适合目标点?

React native 如何使用react native上的MapViewDirections使地图适合目标点?,react-native,google-maps,directions,React Native,Google Maps,Directions,如何使地图适合目的地? 我只需要将相机安装到目标点,而不是像今天这样同时安装到初始坐标和目标坐标。我该怎么做?用另一种方法来拟合坐标 {目的地&& { this.setState{duration:Math.floorresult.duration}; this.mapView.fittocoordinatsresult.coordinates{ 边缘添加:{ 右:getPixelSize10, 左:getPixelSize10, 顶部:getPixelSize10, 底部:getPixelSi

如何使地图适合目的地? 我只需要将相机安装到目标点,而不是像今天这样同时安装到初始坐标和目标坐标。我该怎么做?用另一种方法来拟合坐标

{目的地&& { this.setState{duration:Math.floorresult.duration}; this.mapView.fittocoordinatsresult.coordinates{ 边缘添加:{ 右:getPixelSize10, 左:getPixelSize10, 顶部:getPixelSize10, 底部:getPixelSize50, }, 是的, }; }} /> {destination.title} {duration} 维亚吉姆节奏 {location} }
如果任何人都有一些与GooglePlacesAutocomplete一起工作的代码,那就太好了。

假设您使用的是react native maps,您可以使用以下方法:

animateToRegion:采用两个参数:

区域,具有经度、纬度、longitudeDelta、latitudeDelta的对象最后两个是相机与坐标的距离 duration,动画持续时间(以毫秒为单位) fitToCoordinates:采用两个参数:

坐标,要适合摄影机视图的坐标数组 选项:edgePadding视图周围应添加多少填充,设置动画,无论是否为此视图设置动画 这些方法需要在对地图的引用上调用,就像您在代码示例中所做的那样:this.mapView.fitToCoordinates


您可以使用许多方法将相机安装到目标点,这些方法可能比我上面描述的更适合您的用例。查看以了解更多信息。

这是我的解决方案,我删除此动画的方法说明并替换:

添加此方法:

  getCoordsFromName(loc) { 
     this.mapView.animateToRegion({
      ...this.state.region,
      latitude: loc.lat,
      longitude: loc.lng,
      latitudeDelta: LATITUDE_DELTA,
      longitudeDelta: LONGITUDE_DELTA,
    });
    this.setState(prevState => {
      return {
        region: {
          ...prevState.region,
          latitude: loc.lat,
          longitude: loc.lng,
        },
      };
    });
  }
因此:

 <MapInput style = {{flex: 1, position : 'absolute'}} notifyChange={loc => this.getCoordsFromName(loc)} />

嗨,是的,我正在使用react本地地图。。。我知道可以使用这两个参数,但是如何设置上面的代码,只需放大目标点?感谢您上述两种方法允许您将焦点放在一个点或一组点上,并通过lon/lat Delta或edgePadding确定所需的缩放级别。如果这不能回答你的问题,请编辑你的帖子,并给予更多的澄清。干杯嗨,我用了你的方法,但我改变了搜索位置的方式,你帮我想了个主意,我把你的答案设置正确,因为这个。。。
  getCoordsFromName(loc) { 
     this.mapView.animateToRegion({
      ...this.state.region,
      latitude: loc.lat,
      longitude: loc.lng,
      latitudeDelta: LATITUDE_DELTA,
      longitudeDelta: LONGITUDE_DELTA,
    });
    this.setState(prevState => {
      return {
        region: {
          ...prevState.region,
          latitude: loc.lat,
          longitude: loc.lng,
        },
      };
    });
  }
 <MapInput style = {{flex: 1, position : 'absolute'}} notifyChange={loc => this.getCoordsFromName(loc)} />