Как я могу показать карту маршрута от текущего местоположения до некоторого места назначения (некоторый адрес)

Question

В React-native я разрабатываю пример приложения с использованием act-native-maps, все работает нормально, но я не выяснил, как я могу показать RouteMap из CurrentLocation по другому адресу или расположению:

Вот мой код:

  <MapView
                         ref='map'
                  style={styles.map}
                  region={this.state.mapRegion}
                  showsUserLocation={true}
                  followUserLocation={true}
                  zoomEnabled={true}
                  pitchEnabled={true}
                  showsCompass={true}
                  showsBuildings={true}
                  showsTraffic={true}
                  showsIndoors={true}
                  onRegionChange={this.onRegionChange.bind(this)}
                  onPress={this.onMapPress.bind(this)}>
                 {this.state.markers.map(marker => (
                   <MapView.Marker
                     coordinate={{
                       latitude: marker.Latitude||this.state.lastLat||region.latitude,
                       longitude:marker.Longitude||this.state.lastLong||region.longitude
                     }}
                     image = {
                      marker.EmergencyService == true ?(
                        require('./Imgs/emergencyService.png')):
                        (require('./Imgs/regularService.png'))
                     }
                     onCalloutPress={() => this.bookDoctorsAppointment(marker)}
             >
             <MyCustomMarkerView marker={marker}  navigator={this.props.navigator}/>

             </MapView.Marker>
             ))}
                </MapView>

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

Здесь я прикрепил изображение, которое я хочу, как это:

Answer 1

Вам необходимо отправить запрос по адресу: " https://maps.googleapis.com/maps/api/directions/ ". В основном вам нужно указать координаты отправления и назначения. Дополнительная информация:

Ответ вы должны разобрать с этим:

export function decode (t, e) {
for (var n, o, u = 0, l = 0, r = 0, d = [], h = 0, i = 0, a = null, c 
 = Math.pow(10, e || 5); u < t.length;) {
a = null, h = 0, i = 0
do a = t.charCodeAt(u++) - 63, i |= (31 & a) << h, h += 5; while (a 
>= 32)
n = 1 & i ? ~(i >> 1) : i >> 1, h = i = 0
do a = t.charCodeAt(u++) - 63, i |= (31 & a) << h, h += 5; while (a 
>= 32)
o = 1 & i ? ~(i >> 1) : i >> 1, l += n, r += o, d.push([l / c, r / 
c])
 }
 return d.map(function (t) { return {latitude: t[0], longitude: t[1]} 
})
}

// Эта функция была выбрана из https://github.com/airbnb/react-native-maps/issues/929

Ответ храню по состоянию:

       that.setState({
               route: [decode(res)]
             })





  renderRoute (coordinates, i) {
          return (
            <MapView.Polyline
              key={i}
              coordinates={coordinates}
              strokeColor={......}
              strokeWidth={4}
            />
          );
        }


render () {

          return (
              <MapView
                showsUserLocation
                followsUserLocation
                loadingEnabled
                >
                  {this.state.route.map(this.renderRoute)}
                </MapView>

Таким образом, каждый раз, когда вы обновляете статус, это автоматически обновляет ваш маршрут. Если вам нужна дополнительная помощь, не стесняйтесь задавать больше вопросов