flutter_map показать маркеры в круге (радиусе)

Question

Как реализовать во Flutter (flutter_map) показ маркеров в радиусе (круге) как показано на картинке. Подтолкните на правильный путь. Необязательно пишите про определение местоположения. Мне интересно только появление маркеров (markers) в круге (circle) от заданных координат. Именно в flutter_map остальные пакеты не интересны. Спасибо.

Position _currentPosition;
  static final List<LatLng> _points = [
    LatLng(55.749122, 37.659750),
    LatLng(55.770854, 37.626963),
    LatLng(55.776937, 37.637949),
    LatLng(55.739266, 37.637434),
  ];

  static const _markerSize = 40.0;
  List<Marker> _markers;
  List<CircleMarker> circle;

  @override
  void initState() {
    super.initState();

    _markers = _points
        .map(
          (LatLng point) => Marker(
        point: point,
        width: _markerSize,
        height: _markerSize,
        builder: (_) => Icon(Icons.location_on, size: _markerSize),
      ),
    ).toList();

    _getCurrentLocation();
  }

  _getCurrentLocation() {
    geolocator
        .getCurrentPosition(desiredAccuracy: LocationAccuracy.best)
        .then((Position position) {
      setState(() {
        _currentPosition = position;
      });

    }).catchError((e) {
      print(e);
    });
  }

  @override
  Widget build(BuildContext context) {
    return FlutterMap(
      options: new MapOptions(
          minZoom: 16.0,
          center:  new LatLng(_currentPosition.latitude,_currentPosition.longitude)),
      layers: [new TileLayerOptions(urlTemplate: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
          subdomains: ['a','b','c']),
        new MarkerLayerOptions(
            markers: [
              new Marker(
                  width: 45.0,
                  height: 45.0,
                  point: new LatLng(_currentPosition.latitude,_currentPosition.longitude),
                  builder: (context)=>new Container(
                    child: IconButton(icon: Icon(Icons.accessibility), onPressed: () {print('Marker tapped!');}),
                  ))]),
      MarkerLayerOptions(markers: _markers),
      CircleLayerOptions(circles: [ CircleMarker(
          point: LatLng(_currentPosition.latitude,_currentPosition.longitude),
          color: Colors.blue.withOpacity(0.7),
          borderStrokeWidth: 2,
          useRadiusInMeter: true,
          radius: 2000 // 2000 meters | 2 km
      )]),
    ],
    );
  }

Вот что получилось:

Собственно вопрос. Как сделать, чтобы показать маркеры в радиусе другой иконкой или цветом (без разницы).

Answer 1

Нахождение точек в радиусе находится по формуле:

(x - x0)^2 + (y - y0)^2 = r^2
где 
(x0, y0) - центр
(x, y) - точка, которую проверяем
r - радиус

Просто переносим в функцию:

bool Function(LatLng) checkPointIsInRadius(LatLng center, double radius) {
  return (point) => pow(point.lat - center.lat, 2) + pow(point.lng - center.lng, 2) <= pow(radius, 2);
}

И если дополнить по Вашему примеру:

final checkIsInRadius = checkPointIsInRadius(center, radius);
_markers = _points
    .where((point) => checkIsInRadius(point)) // Оставляем только в радиусе
    .map((LatLng point) => Marker(создание маркера)).

БЛОГ НА HUSL

flutter_map показать маркеры в круге (радиусе)

Ответы (1 шт):