Flutter谷歌地图多段线点计算插件flutter_google_map_polyline_point的使用

当然，以下是如何在Flutter项目中使用flutter_google_maps_polyline_point插件来计算多段线（Polyline）上的点的示例代码。这个插件可以帮助你在Google地图上绘制平滑的曲线，并且可以通过插值计算出曲线上的任意点。

1. 添加依赖

首先，在你的pubspec.yaml文件中添加flutter_google_maps_polyline_point依赖：

dependencies:
  flutter:
    sdk: flutter
  google_maps_flutter: ^2.1.1  # 确保你也添加了google_maps_flutter依赖来显示地图
  flutter_google_maps_polyline_point: ^0.2.10  # 检查最新版本号

2. 导入包

在你的Dart文件中导入必要的包：

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter_google_maps_polyline_point/flutter_google_maps_polyline_point.dart';

3. 设置Google Maps API密钥

确保你的AndroidManifest.xml和Info.plist文件中已经配置了Google Maps API密钥。

4. 编写代码

下面是一个完整的示例，展示如何使用flutter_google_maps_polyline_point插件来计算并显示多段线上的点：

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

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

class MapScreen extends StatefulWidget {
  @override
  _MapScreenState createState() => _MapScreenState();
}

class _MapScreenState extends State<MapScreen> {
  GoogleMapController? _controller;
  Set<Polyline> _polylines = {};
  Set<Marker> _markers = {};

  final LatLng initialPosition = LatLng(37.7749, -122.4194);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Google Maps Polyline Example'),
      ),
      body: GoogleMap(
        mapType: MapType.normal,
        initialCameraPosition: CameraPosition(
          target: initialPosition,
          zoom: 14.0,
        ),
        onMapCreated: (GoogleMapController controller) {
          _controller = controller;
          _addPolylineAndMarkers();
        },
        polylines: _polylines,
        markers: _markers,
      ),
    );
  }

  Future<void> _addPolylineAndMarkers() async {
    // 定义多段线的起点和终点
    final List<LatLng> polylineCoordinates = [
      LatLng(37.7749, -122.4194),
      LatLng(34.0522, -118.2437),
    ];

    // 使用flutter_google_maps_polyline_point插件计算多段线上的点
    final PolylinePoints polylinePoints = PolylinePoints();
    final List<List<double>> points = polylinePoints.decodePolyline(
      polylinePoints.getRouteBetweenCoordinates(
        polylineCoordinates.map((e) => e.latitude!, e.longitude!).toList(),
        apiKey: 'YOUR_GOOGLE_MAPS_API_KEY',  // 替换为你的API密钥
      )!,
    );

    // 创建Polyline
    final Polyline polyline = Polyline(
      polylineId: PolylineId('polyline_id'),
      color: Colors.blue.withOpacity(0.7),
      width: 4,
      points: points.map((list) => LatLng(list[0], list[1])).toList(),
    );

    setState(() {
      _polylines.add(polyline);

      // 添加起点和终点Marker
      _markers.add(Marker(
        markerId: MarkerId('start'),
        position: polylineCoordinates.first,
        infoWindow: InfoWindow(title: 'Start', snippet: 'Start Point'),
      ));
      _markers.add(Marker(
        markerId: MarkerId('end'),
        position: polylineCoordinates.last,
        infoWindow: InfoWindow(title: 'End', snippet: 'End Point'),
      ));

      // 添加多段线上的一个中间点Marker（例如第10个点）
      if (points.length > 10) {
        _markers.add(Marker(
          markerId: MarkerId('middle'),
          position: LatLng(points[10][0], points[10][1]),
          infoWindow: InfoWindow(title: 'Middle', snippet: 'Middle Point'),
        ));
      }
    });
  }
}

注意事项

1. API密钥：确保你已经替换了YOUR_GOOGLE_MAPS_API_KEY为你的实际Google Maps API密钥。
2. 权限：在Android和iOS项目中，确保你已经正确配置了必要的权限和API密钥。
3. 依赖版本：检查flutter_google_maps_polyline_point和google_maps_flutter的最新版本，并根据需要进行更新。

这段代码展示了如何使用flutter_google_maps_polyline_point插件来计算并显示多段线上的点，并在地图上添加起点、终点和中间点的Marker。