codesanitize

I am making a Flutter web page and I wish to have a Mapbox widget that reveals a highlighted circle across the consumer’s location. And there is a slider exterior the map that may regulate the radius of the circle. The circle dimension also needs to be relative to the zoom stage, so if I zoom all the way in which out, the scale would not develop into actually massive.

Proper now, my code works for adjusting the radius, however the map flashes each time the slider strikes. The zoom can be exhausting to make use of, as a result of the zoom stage is reset each time I transfer the slider.

I additionally get an error message each time I transfer the slider

[ERROR:flutter/runtime/dart_vm_initializer.cc(40)] Unhandled Exception: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter.ScaleBarSettingsInterface.updateSettings.2"., null, null)
#0      ScaleBarSettingsInterface.updateSettings (bundle:mapbox_maps_flutter/src/pigeons/settings.dart:1138:7)

#1      _AreaCaptureScreenState._onMapCreated (bundle:sighttrack/screens/seize/area_capture.dart:37:5)

flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CameraManager.getCameraState.2"., null, null)
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CameraManager.getCameraState.2"., null, null)
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CircleAnnotationMessenger.deleteAll.1"., null, null)
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CircleAnnotationMessenger.deleteAll.1"., null, null)
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CameraManager.getCameraState.2"., null, null)
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CircleAnnotationMessenger.deleteAll.1"., null, null)
flutter: Error updating circle: PlatformException(channel-error, Unable to determine connection on channel: "dev.flutter.pigeon.mapbox_maps_flutter._CircleAnnotationMessenger.deleteAll.1"., null, null)
flutter: Error updating circle: Null examine operator used on a null worth
flutter: Error updating circle: Null examine operator used on a null worth

Right here is the web page code (API keys are arrange in most important.dart)

import 'dart:math' as math;

import 'bundle:flutter/materials.dart';
import 'bundle:mapbox_maps_flutter/mapbox_maps_flutter.dart';
import 'bundle:geolocator/geolocator.dart' as geo;

class AreaCaptureScreen extends StatefulWidget {
  const AreaCaptureScreen({tremendous.key});

  @override
  State createState() => _AreaCaptureScreenState();
}

class _AreaCaptureScreenState extends State {
  MapboxMap? _mapboxMap;
  CircleAnnotationManager? _circleManager;
  CircleAnnotation? _circleAnnotation;
  bool _isDisposed = false;
  Level? _centerPoint;
  double _radiusMeters = 300.0; // Non-final

  @override
  void dispose() {
    _isDisposed = true;
    tremendous.dispose();
  }

  void _onMapCreated(MapboxMap mapboxMap) async {
    if (_isDisposed || !mounted) return;
    _mapboxMap = mapboxMap;

    // Cover UI components
    await mapboxMap.emblem.updateSettings(LogoSettings(enabled: false));
    await mapboxMap.attribution.updateSettings(
      AttributionSettings(enabled: false),
    );
    await mapboxMap.scaleBar.updateSettings(ScaleBarSettings(enabled: false));

    // Allow location puck
    await _mapboxMap!.location.updateSettings(
      LocationComponentSettings(
        enabled: true,
        pulsingEnabled: true,
        puckBearingEnabled: true,
      ),
    );

    attempt  !mounted) return;

      _centerPoint = Level(coordinates: Place(pos.longitude, pos.latitude));
      await _mapboxMap!.setCamera(
        CameraOptions(middle: _centerPoint, zoom: 15.0, bearing: pos.heading),
      );

      // Draw preliminary circle
      await _updateCircle();
     catch (e) {
      debugPrint('Error organising map: $e');
    }
  }

  Future _updateCircle() async {
    if (_mapboxMap == null || _centerPoint == null || _isDisposed || !mounted)
      return;

    attempt {
      // Initialize supervisor if not already set
      _circleManager ??=
          await _mapboxMap!.annotations.createCircleAnnotationManager();

      // Calculate pixel radius
      ultimate cameraState = await _mapboxMap!.getCameraState();
      ultimate double groundResolution =
          156543.03392 *
          math.cos(_centerPoint!.coordinates.lat * math.pi / 180) /
          math.pow(2, cameraState.zoom);
      ultimate double pixelRadius = _radiusMeters / groundResolution;

      // At all times create a brand new annotation to keep away from ID points
      await _circleManager!.deleteAll(); // Clear present annotations
      _circleAnnotation = await _circleManager!.create(
        CircleAnnotationOptions(
          geometry: _centerPoint!,
          circleRadius: pixelRadius,
          circleColor: Colour(0xFF33AFFF).toARGB32(),
          circleOpacity: 0.3,
          circleStrokeWidth: 1.5,
          circleStrokeColor: Colour(0xFF0077FF).toARGB32(),
        ),
      );
    } catch (e) {
      debugPrint('Error updating circle: $e');
      // Recreate supervisor on error to deal with potential corruption
      _circleManager = null;
      if (mounted && !_isDisposed) {
        _circleManager =
            await _mapboxMap!.annotations.createCircleAnnotationManager();
        await _updateCircle(); // Retry as soon as
      }
    }
  }

  Future _determinePosition() async {
    bool serviceEnabled = await geo.Geolocator.isLocationServiceEnabled();
    if (!serviceEnabled) throw Exception('Location providers are disabled.');

    geo.LocationPermission permission = await geo.Geolocator.checkPermission();
    if (permission == geo.LocationPermission.denied) {
      permission = await geo.Geolocator.requestPermission();
      if (permission == geo.LocationPermission.denied) {
        throw Exception('Location permissions are denied.');
      }
    }
    if (permission == geo.LocationPermission.deniedForever) {
      throw Exception('Location permissions are completely denied.');
    }

    return await geo.Geolocator.getCurrentPosition();
  }

  @override
  Widget construct(BuildContext context) {
    return Scaffold(
      backgroundColor: Colours.black,
      appBar: AppBar(
        backgroundColor: Colours.clear,
        foregroundColor: Colours.white,
      ),
      physique: SafeArea(
        youngster: Padding(
          padding: const EdgeInsets.all(16.0),
          youngster: Column(
            kids: [
              Container(
                height: 300,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(12),
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: MapWidget(
                    styleUri:
                        '',
                    cameraOptions: CameraOptions(
                      center: Point(coordinates: Position(-122.4194, 37.7749)),
                      zoom: 15.0,
                    ),
                    onMapCreated: _onMapCreated,
                    onCameraChangeListener: (event) {
                      if (_circleAnnotation != null) {
                        _updateCircle();
                      }
                    },
                    key: UniqueKey(),
                  ),
                ),
              ),
              Slider(
                value: _radiusMeters,
                min: 100.0,
                max: 1000.0,
                onChanged: (newRadius) {
                  setState(() {
                    _radiusMeters = newRadius;
                    _updateCircle();
                  });
                },
              ),
            ],
          ),
        ),
      ),
    );
  }
}