Repository: flutter
Issue: [Google_maps_flutter] Performing a tap or drag gesture on extended MarkerId throws exception Unknown markerId
Labels: p: maps,package,team-ecosystem,has reproducible steps,P3,found in release: 2.10,found in release: 2.13,triaged-ecosystem

## Steps to Reproduce

<!-- Please include full steps to reproduce so that we can reproduce the problem. -->

1. Execute `flutter run` on the code sample
2. there are 2 markers with MyMarkerId which extends MarkerId and MyInfoWindow which extend InfoWindow and the other 2 markers are with default MarkerId & InfoWindow.
3. try tapping/dragging them. You will notice that the markers with MyMarkerId will throw an error on Tap/onDrag with Custom MarkerId like 'Unhandled Exception: Unknown marker ID "prefix_default_marker_2" in onTap' whereas the MyMarker2/Marker with MarkerId works as expected.  

**Expected results:** MyMarkerId entends the MarkerId which means it is a MarkerId. it should be able to search the Marker using MyMarkerId.

```dart
 void onMarkerTap(MarkerId markerId) {
    assert(markerId != null);
    final Marker? marker = _markers[markerId];
    if (marker == null) {
      throw UnknownMapObjectIdError('marker', markerId, 'onTap');
    }
    final VoidCallback? onTap = marker.onTap;
    if (onTap != null) {
      onTap();
    }
  }
``` 

**Actual results:** But, in the code like above ```  final Marker? marker = _markers[markerId]; ``` returns null instead of finding a marker which results in an error like "Unhandled Exception: Unknown marker ID "prefix_default_marker_2" in onTap".

<details>
<summary>Code sample</summary>


```dart
import 'dart:async';

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Google Maps Demo',
      home: MapSample(),
    );
  }
}

class MapSample extends StatefulWidget {
  const MapSample({Key? key}) : super(key: key);

  @override
  State<MapSample> createState() => MapSampleState();
}

class MapSampleState extends State<MapSample> {
  final Completer<GoogleMapController> _controller = Completer();
  static const String myMarker = 'my_marker',
      myMarker2 = 'my_marker_2',
      defaultMarker = 'default_marker',
      defaultMarker2 = 'default_marker_2';

  late final _marker1 = MyMarker(
    myMarkerId: const MyMarkerId(myMarker),
    draggable: true,
    position: const LatLng(37.43296265331129, -122.08832357078792),
    onDrag: (newPosition) => _onDrag(myMarker, newPosition),
    infoWindow: const InfoWindow(
      title: myMarker,
      snippet: "Default Info Window",
    ),
    onDragStart: (newPosition) => _onDragStart(myMarker, newPosition),
    onDragEnd: (newPosition) => _onDragEnd(myMarker, newPosition),
  );

  late final _marker2 = MyMarker2(
    myMarkerId: const MarkerId(myMarker2),
    draggable: true,
    position: const LatLng(37.43306265331129, -122.08832357078792),
    onDrag: (newPosition) => _onDrag(myMarker2, newPosition),
    infoWindow: const MyInfoWindow(
        title: myMarker2, snippet: "with custom Info Window"),
    onDragStart: (newPosition) => _onDragStart(myMarker2, newPosition),
    onDragEnd: (newPosition) => _onDragEnd(myMarker2, newPosition),
  );

  late final _marker3 = Marker(
    markerId: const MarkerId(defaultMarker),
    draggable: true,
    position: const LatLng(37.43316265331129, -122.08832357078792),
    onDrag: (newPosition) => _onDrag(defaultMarker, newPosition),
    infoWindow: const InfoWindow(
        title: defaultMarker, snippet: "with Default Info Window"),
    onDragStart: (newPosition) => _onDragStart(defaultMarker, newPosition),
    onDragEnd: (newPosition) => _onDragEnd(defaultMarker, newPosition),
  );

  late final _marker4 = Marker(
    markerId: const MyMarkerId(defaultMarker2),
    draggable: true,
    position: const LatLng(37.43326265331129, -122.08832357078792),
    onDrag: (newPosition) => _onDrag(defaultMarker2, newPosition),
    infoWindow: const MyInfoWindow(
        title: defaultMarker2, snippet: "with Custom Info Window"),
    onDragStart: (newPosition) => _onDragStart(defaultMarker2, newPosition),
    onDragEnd: (newPosition) => _onDragEnd(defaultMarker2, newPosition),
  );

  late final Set<Marker> _markers = {
    _marker1,
    _marker2,
    _marker3,
    _marker4,
  };

  void _onDrag(String markerId, LatLng position) {
    print("onDrag: $markerId, position: $position");
  }

  void _onDragStart(String markerId, LatLng position) {
    print("onDrag: $markerId, position: $position");
  }

  void _onDragEnd(String markerId, LatLng position) {
    print("onDrag: $markerId, position: $position");
  }

  static const CameraPosition _kGooglePlex = CameraPosition(
    target: LatLng(37.43306265331129, -122.08832357078792),
    zoom: 18,
  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GoogleMap(
        initialCameraPosition: _kGooglePlex,
        onMapCreated: (GoogleMapController controller) {
          _controller.complete(controller);
        },
        markers: _markers,
      ),
    );
  }
}

@immutable
class MyMarker extends Marker {
  final MyMarkerId myMarkerId;
  const MyMarker({
    required this.myMarkerId,
    bool draggable = false,
    LatLng position = const LatLng(0.0, 0.0),
    InfoWindow infoWindow = InfoWindow.noText,
    VoidCallback? onTap,
    ValueChanged<LatLng>? onDrag,
    ValueChanged<LatLng>? onDragStart,
    ValueChanged<LatLng>? onDragEnd,
  }) : super(
          markerId: myMarkerId,
          draggable: draggable,
          position: position,
          onTap: onTap,
          infoWindow: infoWindow,
          onDrag: onDrag,
          onDragStart: onDragStart,
          onDragEnd: onDragEnd,
        );
}

@immutable
class MyMarkerId extends MarkerId {
  const MyMarkerId(String markerId) : super('prefix_$markerId');
}

@immutable
class MyInfoWindow extends InfoWindow {
  const MyInfoWindow({
    required String title,
    required String snippet,
    Offset anchor = const Offset(0.5, 0.0),
    VoidCallback? onTap,
  }) : super(
          title: title,
          snippet: snippet,
          anchor: anchor,
          onTap: onTap,
        );
}

@immutable
class MyMarker2 extends Marker {
  const MyMarker2({
    required MarkerId myMarkerId,
    bool draggable = false,
    LatLng position = const LatLng(0.0, 0.0),
    MyInfoWindow? infoWindow,
    VoidCallback? onTap,
    ValueChanged<LatLng>? onDrag,
    ValueChanged<LatLng>? onDragStart,
    ValueChanged<LatLng>? onDragEnd,
  }) : super(
          markerId: myMarkerId,
          draggable: draggable,
          position: position,
          onTap: onTap,
          infoWindow: infoWindow ?? InfoWindow.noText,
          onDrag: onDrag,
          onDragStart: onDragStart,
          onDragEnd: onDragEnd,
        );
}
```

</details>