ola_maps_flutter 0.1.0

A Flutter plugin for integrating Ola Maps SDK. Provides interactive maps with markers, polylines, circles, polygons, bezier curves, and marker clustering.

example/lib/main.dart

import 'package:flutter/material.dart';

import 'package:ola_maps_flutter/ola_map_view_flutter.dart';
import 'package:permission_handler/permission_handler.dart';

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  OlaMapController? _mapController;
  String? _lastMarkerId;
  String? _lastPolylineId;
  String? _lastCircleId;
  String? _lastPolygonId;
  String? _lastBezierCurveId;

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

  Future<void> _requestLocationPermission() async {
    await Permission.location.request();
  }

  void _addMarker() async {
    if (_mapController != null) {
      final markerId = await _mapController!.addMarker(
        position: const OlaLatLng(18.52145653681468, 73.93178277572254),
        isClickable: true,
        iconRotation: 0.0,
        isAnimationEnabled: true,
        snippet: "Ola Campus",
        subSnippet: "Tap to see more info",
        isInfoWindowDismissOnClick: true,
      );
      setState(() {
        _lastMarkerId = markerId;
      });
      print('Marker added with InfoWindow: $markerId');
    }
  }

  void _removeMarker() {
    if (_mapController != null && _lastMarkerId != null) {
      _mapController!.removeMarker(_lastMarkerId!);
      print('Marker removed: $_lastMarkerId');
      setState(() {
        _lastMarkerId = null;
      });
    }
  }

  void _addPolyline() async {
    if (_mapController != null) {
      final polylineId = await _mapController!.addPolyline(
        points: const [
          OlaLatLng(18.52145653681468, 73.93178277572254),
          OlaLatLng(18.52345653681468, 73.93378277572254),
          OlaLatLng(18.52545653681468, 73.93578277572254),
        ],
        color: "#FF0000",
        width: 5.0,
      );
      setState(() {
        _lastPolylineId = polylineId;
      });
      print('Polyline added: $polylineId');
    }
  }

  void _removePolyline() {
    if (_mapController != null && _lastPolylineId != null) {
      _mapController!.removePolyline(_lastPolylineId!);
      print('Polyline removed: $_lastPolylineId');
      setState(() {
        _lastPolylineId = null;
      });
    }
  }

  void _addCircle() async {
    if (_mapController != null) {
      final circleId = await _mapController!.addCircle(
        center: const OlaLatLng(18.52145653681468, 73.93178277572254),
        radius: 500.0,
        color: "#0000FF",
        opacity: 0.3,
      );
      setState(() {
        _lastCircleId = circleId;
      });
      print('Circle added: $circleId');
    }
  }

  void _removeCircle() {
    if (_mapController != null && _lastCircleId != null) {
      _mapController!.removeCircle(_lastCircleId!);
      print('Circle removed: $_lastCircleId');
      setState(() {
        _lastCircleId = null;
      });
    }
  }

  void _addPolygon() async {
    if (_mapController != null) {
      final polygonId = await _mapController!.addPolygon(
        points: const [
          OlaLatLng(18.52145653681468, 73.93178277572254),
          OlaLatLng(18.52345653681468, 73.93378277572254),
          OlaLatLng(18.52545653681468, 73.93578277572254),
          OlaLatLng(18.52545653681468, 73.93178277572254),
        ],
        color: "#00FF00",
      );
      setState(() {
        _lastPolygonId = polygonId;
      });
      print('Polygon added: $polygonId');
    }
  }

  void _removePolygon() {
    if (_mapController != null && _lastPolygonId != null) {
      _mapController!.removePolygon(_lastPolygonId!);
      print('Polygon removed: $_lastPolygonId');
      setState(() {
        _lastPolygonId = null;
      });
    }
  }

  void _addBezierCurve() async {
    if (_mapController != null) {
      final curveId = await _mapController!.addBezierCurve(
        startPoint: const OlaLatLng(18.52145653681468, 73.93178277572254),
        endPoint: const OlaLatLng(18.52545653681468, 73.93578277572254),
        color: "#FF00FF",
        width: 4.0,
      );
      setState(() {
        _lastBezierCurveId = curveId;
      });
      print('Bezier curve added: $curveId');
    }
  }

  void _removeBezierCurve() {
    if (_mapController != null && _lastBezierCurveId != null) {
      _mapController!.removeBezierCurve(_lastBezierCurveId!);
      print('Bezier curve removed: $_lastBezierCurveId');
      setState(() {
        _lastBezierCurveId = null;
      });
    }
  }

  void _zoomToOlaCampus() {
    if (_mapController != null) {
      _mapController!.zoomToLocation(
        const OlaLatLng(18.52145653681468, 73.93178277572254),
        16.0,
      );
      print('Zoomed to Ola Campus');
    }
  }

  void _getCurrentLocation() async {
    if (_mapController != null) {
      final location = await _mapController!.getCurrentLocation();
      if (location != null) {
        print('Current location: ${location.latitude}, ${location.longitude}');
      } else {
        print('Location not available');
      }
    }
  }

  void _toggleCurrentLocation() {
    if (_mapController != null) {
      // Toggle between showing and hiding
      _mapController!.showCurrentLocation();
      print('Showing current location');
    }
  }

  void _zoomToCurrentLocation() async {
    if (_mapController != null) {
      final location = await _mapController!.getCurrentLocation();
      if (location != null) {
        await _mapController!.zoomToLocation(location, 15.0);
        print('Zoomed to current location: ${location.latitude}, ${location.longitude}');
      } else {
        print('Could not get current location');
      }
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Ola Map Plugin Example'),
        ),
        body: Stack(
          children: [
            OlaMapView(
              apiKey: "YOUR_OLA_MAPS_API_KEY_HERE",
              onMapCreated: (id) {
                print("Map created with id: $id");
              },
              onControllerReady: (controller) {
                setState(() {
                  _mapController = controller;
                });
                print("Controller ready");
                // Zoom to current location
                _zoomToCurrentLocation();
              },
              showZoomControls: true,
              showCompass: true,
              showMyLocationButton: true,
              myLocationEnabled: true,
              zoomGesturesEnabled: true,
              scrollGesturesEnabled: true,
              tiltGesturesEnabled: true,
              rotateGesturesEnabled: true,
              doubleTapGesturesEnabled: true,
            ),
            Positioned(
              bottom: 20,
              right: 20,
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  FloatingActionButton(
                    heroTag: 'add_marker',
                    onPressed: _mapController == null ? null : _addMarker,
                    child: const Icon(Icons.add_location),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'remove_marker',
                    onPressed: _lastMarkerId == null ? null : _removeMarker,
                    child: const Icon(Icons.remove_circle),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'add_polyline',
                    backgroundColor: Colors.blue,
                    onPressed: _mapController == null ? null : _addPolyline,
                    child: const Icon(Icons.timeline),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'remove_polyline',
                    backgroundColor: Colors.red,
                    onPressed: _lastPolylineId == null ? null : _removePolyline,
                    child: const Icon(Icons.clear),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'add_circle',
                    backgroundColor: Colors.green,
                    onPressed: _mapController == null ? null : _addCircle,
                    child: const Icon(Icons.circle_outlined),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'remove_circle',
                    backgroundColor: Colors.orange,
                    onPressed: _lastCircleId == null ? null : _removeCircle,
                    child: const Icon(Icons.cancel_outlined),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'add_polygon',
                    backgroundColor: Colors.purple,
                    onPressed: _mapController == null ? null : _addPolygon,
                    child: const Icon(Icons.hexagon_outlined),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'remove_polygon',
                    backgroundColor: Colors.brown,
                    onPressed: _lastPolygonId == null ? null : _removePolygon,
                    child: const Icon(Icons.delete_outline),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'add_bezier',
                    backgroundColor: Colors.pink,
                    onPressed: _mapController == null ? null : _addBezierCurve,
                    child: const Icon(Icons.show_chart),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'remove_bezier',
                    backgroundColor: Colors.teal,
                    onPressed: _lastBezierCurveId == null ? null : _removeBezierCurve,
                    child: const Icon(Icons.close),
                  ),
                ],
              ),
            ),
            // Zoom controls on the left
            Positioned(
              bottom: 20,
              left: 20,
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  FloatingActionButton(
                    heroTag: 'zoom_in',
                    onPressed: _mapController == null ? null : () => _mapController!.zoomIn(),
                    child: const Icon(Icons.add),
                  ),
                  const SizedBox(height: 10),
                  FloatingActionButton(
                    heroTag: 'zoom_out',
                    onPressed: _mapController == null ? null : () => _mapController!.zoomOut(),
                    child: const Icon(Icons.remove),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}