Flutter谷歌路线规划插件google_routes_flutter的使用

Flutter谷歌路线规划插件google_routes_flutter的使用

本插件是dart接口到Google 路线API。 它允许你获取两个地点之间的路线信息,例如距离、旅行时间等。

功能

  • computeRoute
  • computeRouteMatrix

开始使用

只需将插件添加到你的pubspec.yaml文件中:

dart pub add google_routes_flutter

使用方法

computeRoute

计算两个点之间的路线。

var computeRoutesResult = await computeRoute(
  origin: Waypoint(
    location: Location(
      latLng: LatLng(
        latitude: 33.25889341635255,
        longitude: 35.210018284644185,
      ),
    ),
  ),
  destination: Waypoint(
    location: Location(
      latLng: LatLng(
        latitude: 33.278430320176085,
        longitude: 35.216819613960894,
      ),
    ),
  ),
  xGoogFieldMask: 'routes.distanceMeters,routes.routeLabels',
  apiKey: 'YOUR_API_KEY',
);

computeRouteMatrix

计算提供的所有起点和终点对之间的路线。

var computeRouteMatrixResult = await computeRouteMatrix(
  origins: [
    RouteMatrixOrigin(
      waypoint: Waypoint(
        location: Location(
          latLng: LatLng(
            latitude: 33.25889341635255,
            longitude: 35.210018284644185,
          ),
        ),
      ),
    ),
  ],
  destinations: [
    RouteMatrixDestination(
      waypoint: Waypoint(
        location: Location(
          latLng: LatLng(
            latitude: 33.278430320176085,
            longitude: 35.216819613960894,
          ),
        ),
      ),
    ),
  ],
  xGoogFieldMask: 'distanceMeters',
  apiKey: 'YOUR_API_KEY',
);

示例代码

以下是一个完整的示例代码,展示了如何使用google_routes_flutter插件来计算路线。

import 'package:google_routes_flutter/google_routes_flutter.dart';

Future<void> main() async {
  try {
    // 计算单个路线
    var computeRoutesResult = await computeRoute(
      origin: Waypoint(
        location: Location(
          latLng: LatLng(
            latitude: 33.25889341635255,
            longitude: 35.210018284644185,
          ),
        ),
      ),
      destination: Waypoint(
        location: Location(
          latLng: LatLng(
            latitude: 33.278430320176085,
            longitude: 35.216819613960894,
          ),
        ),
      ),
      xGoogFieldMask: 'routes.distanceMeters,routes.routeLabels',
      apiKey: 'YOUR_API_KEY',
    );

    // 计算多个路线矩阵
    var computeRouteMatrixResult = await computeRouteMatrix(
      origins: [
        RouteMatrixOrigin(
          waypoint: Waypoint(
            location: Location(
              latLng: LatLng(
                latitude: 33.25889341635255,
                longitude: 35.210018284644185,
              ),
            ),
          ),
        ),
      ],
      destinations: [
        RouteMatrixDestination(
          waypoint: Waypoint(
            location: Location(
              latLng: LatLng(
                latitude: 33.278430320176085,
                longitude: 35.216819613960894,
              ),
            ),
          ),
        ),
      ],
      xGoogFieldMask: 'distanceMeters',
      apiKey: 'YOUR_API_KEY',
    );

    // 打印结果
    print(
      'API Call 1: distance is '
      '${computeRoutesResult.routes?.firstWhere(
            (route) =>
                (route.routeLabels?.contains(RouteLabel.defaultRoute) ?? false),
          ).distanceMeters}'
      ' meters',
    );

    print(
      'API Call 2: distance is '
      '${computeRouteMatrixResult.first.distanceMeters}'
      ' meters',
    );
  } catch (e) {
    print(e);
  }
}

更多关于Flutter谷歌路线规划插件google_routes_flutter的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter谷歌路线规划插件google_routes_flutter的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用google_routes_flutter插件来进行路线规划的示例代码。需要注意的是,google_routes_flutter插件本身可能并不是官方或广泛认知的插件名称,因此这里假设它提供的功能与常见的路线规划插件类似,比如使用Google Maps Directions API。

在实际应用中,你可能会使用flutter_mapgoogle_maps_flutter结合Google Maps Directions API来实现路线规划。不过,为了符合你的要求,我将假设google_routes_flutter是一个封装了这些功能的插件,并提供了一个简单的接口。

首先,你需要在pubspec.yaml文件中添加依赖(注意:这里假设google_routes_flutter是一个有效的包名,如果不是,请替换为实际的包名):

dependencies:
  flutter:
    sdk: flutter
  google_routes_flutter: ^x.y.z  # 替换为实际的版本号

然后,运行flutter pub get来安装依赖。

接下来,在你的Dart文件中,你可以这样使用google_routes_flutter插件:

import 'package:flutter/material.dart';
import 'package:google_routes_flutter/google_routes_flutter.dart'; // 假设这是插件的导入路径

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: RoutePlanningScreen(),
    );
  }
}

class RoutePlanningScreen extends StatefulWidget {
  @override
  _RoutePlanningScreenState createState() => _RoutePlanningScreenState();
}

class _RoutePlanningScreenState extends State<RoutePlanningScreen> {
  final TextEditingController _originController = TextEditingController();
  final TextEditingController _destinationController = TextEditingController();
  List<Map<String, dynamic>>? _routePoints;

  void _getRoute() async {
    String origin = _originController.text;
    String destination = _destinationController.text;

    if (origin.isEmpty || destination.isEmpty) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('Origin and Destination cannot be empty')),
      );
      return;
    }

    try {
      // 假设插件提供了一个名为getRoute的方法
      var route = await GoogleRoutes.getRoute(
        origin: origin,
        destination: destination,
        apiKey: 'YOUR_GOOGLE_MAPS_API_KEY', // 请替换为你的Google Maps API密钥
      );

      setState(() {
        _routePoints = route?.points;
      });
    } catch (e) {
      print('Error fetching route: $e');
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text('Error fetching route')),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Route Planning'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            TextField(
              controller: _originController,
              decoration: InputDecoration(labelText: 'Origin'),
            ),
            SizedBox(height: 16),
            TextField(
              controller: _destinationController,
              decoration: InputDecoration(labelText: 'Destination'),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: _getRoute,
              child: Text('Get Route'),
            ),
            SizedBox(height: 16),
            if (_routePoints != null)
              Polyline(
                polylinePoints: _routePoints!,
                builder: (context, points) {
                  return CustomPaint(
                    size: Size.infinite,
                    painter: PolylinePainter(points),
                  );
                },
              ), // 假设有一个Polyline组件来显示路线,这里需要自定义或使用现有库
          ],
        ),
      ),
    );
  }
}

// 假设有一个PolylinePainter类来绘制路线,这里需要自定义
class PolylinePainter extends CustomPainter {
  final List<LatLng> points;

  PolylinePainter(this.points);

  @override
  void paint(Canvas canvas, Size size) {
    final Paint paint = Paint()
      ..color = Colors.blue
      ..strokeWidth = 4
      ..style = PaintingStyle.stroke;

    for (int i = 0; i < points.length - 1; i++) {
      final LatLng from = points[i];
      final LatLng to = points[i + 1];
      final Offset offsetFrom = _latLngToOffset(from, size);
      final Offset offsetTo = _latLngToOffset(to, size);
      canvas.drawLine(offsetFrom, offsetTo, paint);
    }
  }

  Offset _latLngToOffset(LatLng latLng, Size size) {
    // 简单的转换逻辑,实际使用中需要考虑地图的投影和缩放
    final double x = (latLng.latitude - -90.0) / (90.0 - (-90.0)) * size.width;
    final double y = (latLng.longitude - -180.0) / (180.0 - (-180.0)) * size.height;
    return Offset(x, y);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return oldDelegate != this;
  }
}

// 假设LatLng是一个简单的类来表示经纬度
class LatLng {
  final double latitude;
  final double longitude;

  LatLng({required this.latitude, required this.longitude});
}

注意

  1. 上面的代码假设GoogleRoutes.getRoute方法存在并返回一个包含路线点的列表。在实际应用中,你可能需要使用HTTP客户端(如diohttp包)来调用Google Maps Directions API。
  2. PolylinePolylinePainter是假设的组件和画家类,用于在屏幕上绘制路线。在实际应用中,你可能需要使用现有的地图库(如flutter_mapgoogle_maps_flutter)来显示和绘制路线。
  3. _latLngToOffset方法中的转换逻辑非常简单,并不考虑地图的投影、缩放和中心点等因素。在实际应用中,你需要根据使用的地图库进行相应的转换。
  4. 请确保你已经获得了Google Maps API密钥,并在调用API时正确使用了它。同时,注意遵守Google Maps API的使用条款和限制。
回到顶部