Question

我正在实现一个抖动应用程序，以通过flutter google maps插件显示折线，但是它只显示了这两个点之间的一条直线，而不是显示了实际路线，我不确定该怎么做。

这是我的添加标记功能

void addMarker() {
latlng.add(LatLng(5.973804, 80.429838));
allMarkers.add(Marker(
  markerId: MarkerId('busLoc'),
  draggable: true,
  onTap: () {
    print('Marker Tapped');
  },
  position: LatLng(5.973804, 80.429838),
));

_polyline.add(Polyline(
  color: Colors.blue,
  visible: true,
  points: latlng,
  polylineId: PolylineId("distance"),
));

这是我的脚手架

GoogleMap(
    
    polylines: _polyline,
    markers: Set.from(allMarkers),
    initialCameraPosition:
        CameraPosition(target: LatLng(widget.la, widget.l0), zoom: 14),
    mapType: MapType.normal,
  ),

我还将在下面附上屏幕截图

Answer 1

它显示直线，因为折线中只有两个点，所以预期的行为是从一个点到另一点画一条线

Answer 2

要获取从A点到B点的路线，您需要使用google_maps_webservice flutter软件包中提供的Directions API，该软件包是Google Maps Platform提供的提供路线信息的服务

其中一个路线信息是overview_polyline，其中包含该路线的编码折线表示。

您可以通过使用overview_polyline包将函数发送请求到Directions API的功能来获得google_maps_webservice：

import 'package:google_maps_webservice/directions.dart' as directions;

final _directions = new directions.GoogleMapsDirections(apiKey: "YOUR_API_KEY");

var overviewPolylines;

directions.DirectionsResponse dResponse = await _directions.directionsWithAddress(
     _originAddress, 
     _destinationAddress, 
);

if (dResponse.isOkay) {
  for (var r in dResponse.routes) {
    overviewPolylines = r.overviewPolyline.points
  }
}

然后，一旦使用上述示例代码从Directions API中获得了overview_polyline，就需要使用google_maps_util flutter包中的PolyUtil();方法对其进行解码，如下所示：< / p>

import 'package:google_maps_util/google_maps_util.dart';

PolyUtil myPoints = PolyUtil();
var pointArray = myPoints.decode(overviewPolylines);

解码后，您可以像这样将pointArray传递给polyline对象：

_polyline.add(Polyline(
 color: Colors.blue,
  visible: true,
  points: pointArray,
  polylineId: PolylineId("distance"),
));

Answer 3

您必须使用谷歌方向API，这是一篇文章，说明如何在扑动中的两个点之间绘制路线。

https://medium.com/flutter-community/drawing-route-lines-on-google-maps-between-two-locations-in-flutter-4d351733ccbe

颤振：折线显示直线

3 个答案: