js_interop wip

packages/google_maps_flutter/google_maps_flutter_web/lib/src/marker_clustering.dart

@@ -74,7 +74,7 @@ class ClusterManagersController extends GeometryController {
         _clusterManagerIdToMarkerClusterer[clusterManagerId];
     if (markerClusterer != null) {
       markerClusterer.addMarker(marker, true);
-      markerClusterer.dirty = true;
+      markerClusterer.render();
     }
   }
 
@@ -86,25 +86,11 @@ class ClusterManagersController extends GeometryController {
           _clusterManagerIdToMarkerClusterer[clusterManagerId];
       if (markerClusterer != null) {
         markerClusterer.removeMarker(marker, true);
-        markerClusterer.dirty = true;
+        markerClusterer.render();
       }
     }
   }
 
-  /// Renders all cluster managers that are marked as dirty.
-  ///
-  /// This mechanism is used to batch changes to the cluster managers to avoid
-  /// unnecessary re-renders.
-  /// [MarkerClusterer] is marked as dirty when a marker is added or removed.
-  void renderDirty() {
-    _clusterManagerIdToMarkerClusterer.values
-        .where((MarkerClusterer markerClusterer) => markerClusterer.dirty)
-        .forEach((MarkerClusterer markerClusterer) {
-      markerClusterer.dirty = false;
-      markerClusterer.render();
-    });
-  }
-
   /// Returns list of clusters in [MarkerClusterer] with given
   /// [ClusterManagerId].
   List<Cluster> getClusters(ClusterManagerId clusterManagerId) {

packages/google_maps_flutter/google_maps_flutter_web/lib/src/marker_clustering_js_interop.dart

@@ -2,8 +2,10 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'dart:js_interop';
+import 'dart:js_util' as js_util;
+
 import 'package:google_maps/google_maps.dart' as gmaps;
-import 'package:js/js.dart';
 
 /// A typedef representing a callback function for handling cluster tap events.
 typedef ClusterClickHandler = void Function(
@@ -12,7 +14,7 @@ typedef ClusterClickHandler = void Function(
 /// The [MarkerClustererOptions] object used to initialize [MarkerClusterer].
 @JS()
 @anonymous
-abstract class MarkerClustererOptions {
+extension type MarkerClustererOptions._(JSObject _) implements JSObject {
   /// Constructs a new [MarkerClustererOptions] object.
   external factory MarkerClustererOptions();
 
@@ -37,7 +39,7 @@ abstract class MarkerClustererOptions {
 
 /// The cluster object handled by the [MarkerClusterer].
 @JS('markerClusterer.Cluster')
-abstract class MarkerClustererCluster {
+extension type MarkerClustererCluster._(JSObject _) implements JSObject {
   /// Getter for the cluster marker.
   external gmaps.Marker get marker;
 
@@ -62,7 +64,7 @@ abstract class MarkerClustererCluster {
 
 /// The [MarkerClusterer] object used to cluster markers on the map.
 @JS('markerClusterer.MarkerClusterer')
-class MarkerClusterer {
+extension type MarkerClusterer._(JSObject _) implements JSObject {
   /// Constructs a new [MarkerClusterer] object.
   external MarkerClusterer(MarkerClustererOptions options);
 
@@ -92,9 +94,6 @@ class MarkerClusterer {
 
   /// Recalculates and draws all the marker clusters.
   external void render();
-
-  /// Flag to control the need for re-rendering the cluster after bulk changes.
-  bool dirty = false;
 }
 
 /// Creates [MarkerClusterer] object with given [gmaps.GMap] and
@@ -110,7 +109,7 @@ MarkerClustererOptions _createClusterOptions(
     gmaps.GMap map, ClusterClickHandler onClusterClickHandler) {
   final MarkerClustererOptions options = MarkerClustererOptions()
     ..map = map
-    ..onClusterClick = allowInterop(onClusterClickHandler);
+    ..onClusterClick = js_util.allowInterop(onClusterClickHandler);
 
   return options;
 }

packages/google_maps_flutter/google_maps_flutter_web/lib/src/markers.dart

@@ -31,7 +31,6 @@ class MarkersController extends GeometryController {
   /// Wraps each [Marker] into its corresponding [MarkerController].
   void addMarkers(Set<Marker> markersToAdd) {
     markersToAdd.forEach(_addMarker);
-    _clusterManagersController.renderDirty();
   }
 
   void _addMarker(Marker marker) {
@@ -93,7 +92,6 @@ class MarkersController extends GeometryController {
   /// Updates a set of [Marker] objects with new options.
   void changeMarkers(Set<Marker> markersToChange) {
     markersToChange.forEach(_changeMarker);
-    _clusterManagersController.renderDirty();
   }
 
   void _changeMarker(Marker marker) {
@@ -126,7 +124,6 @@ class MarkersController extends GeometryController {
   /// Removes a set of [MarkerId]s from the cache.
   void removeMarkers(Set<MarkerId> markerIdsToRemove) {
     markerIdsToRemove.forEach(_removeMarker);
-    _clusterManagersController.renderDirty();
   }
 
   void _removeMarker(MarkerId markerId) {

packages/google_maps_flutter/google_maps_flutter_web/pubspec.yaml

@@ -24,7 +24,6 @@ dependencies:
     sdk: flutter
   google_maps: ^7.1.0
   google_maps_flutter_platform_interface: ^2.6.0
-  js: ^0.6.7
   sanitize_html: ^2.0.0
   stream_transform: ^2.0.0
   web: ^0.5.1