android - 谷歌地图方向 - 设置自定义路线

Question

我的代码逻辑有问题，到目前为止，我从教程和文档中看到的逻辑是找到最短路径。我想忽略最短路线，我想让车辆计算我想要的路线的距离。我希望公共汽车绕过蓝色标记，但它总是找到最短距离（参考这张图片）-> Map SearchBar

import React from 'react';
import MapView, {PROVIDER_GOOGLE, Marker} from 'react-native-maps';
import MapViewDirections from 'react-native-maps-directions';

import { PinchGestureHandler } from 'react-native-gesture-handler';

const GOOGLE_MAPS_APIKEY = 'API_KEY';

const RouteMap = ({ origin, destination }) => {

  const originLoc = {
    latitude: origin.details.geometry.location.lat,
    longitude: origin.details.geometry.location.lng,
  };

  const destinationLoc = {
    latitude: destination.details.geometry.location.lat,
    longitude: destination.details.geometry.location.lng,
  };

  // latitude - longitude
  const smClark = {
    latitude: 15.166958649105302,
    longitude: 120.58020821518215
  };

  const crkAirport = {
    latitude: 15.188257381909379,
    longitude: 120.54864679960974
  };
  
  const puregold = {
    latitude: 15.193613083464797,
    longitude: 120.5301874657224
  };

  const royceHotel = {
    latitude: 15.180685277215424,
    longitude: 120.52912493815806
  };

  const mGate_1 = {
    latitude: 15.166953827506548,
    longitude: 120.58283672474597
  };

  const mGate_2 = {
    latitude: 15.167813741260368,
    longitude: 120.5829972483142
  };

  
  
  return ( 
    <MapView
      style={{width: '100%', height: '100%'}}
      provider={PROVIDER_GOOGLE}
      // showsUserLocation={true}
      initialRegion={{
        latitude: 15.166958649105302,
        longitude: 120.58020821518215,
        latitudeDelta: 0.015,
        longitudeDelta: 0.015,
        }}
      zoomControlEnabled
        >


      
      {/* Marker dynamic */}
      <MapViewDirections
        origin={originLoc}
        destination={destinationLoc}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={7}
        strokeColor="black"
        />

      
      {/* Loop 1 - Marker */}
      <MapViewDirections
        origin={smClark}
        destination={crkAirport}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
      <MapViewDirections
        origin={crkAirport}
        destination={puregold}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
      <MapViewDirections
        origin={puregold}
        destination={royceHotel}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
      <MapViewDirections
        origin={royceHotel}
        destination={mGate_1}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
      <MapViewDirections
        origin={mGate_1}
        destination={mGate_2}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
      
      <MapViewDirections
        origin={mGate_2}
        destination={smClark}
        apikey={GOOGLE_MAPS_APIKEY}
        strokeWidth={3}
        strokeColor="blue"
        />
    </MapView>
  );
};

export default RouteMap;

标签： androidreact-nativegoogle-mapsgoogle-cloud-platformmobile