// import 'dart:async';
// import 'package:flutter/material.dart';
// import 'package:flutter_map/plugin_api.dart';
// import 'package:flutter_map_location_marker/flutter_map_location_marker.dart';
// import 'package:flutter_map_marker_cluster/flutter_map_marker_cluster.dart';2
// import 'package:get/get.dart';
// import 'package:get/get_state_manager/get_state_manager.dart';
// import 'package:latlong2/latlong.dart';
// import 'package:rogapp/pages/index/index_controller.dart';
// import 'package:rogapp/widgets/base_layer_widget.dart';
// import 'package:rogapp/widgets/bottom_sheet_new.dart';
// import 'package:rogapp/widgets/bottom_sheet_widget.dart';

// class MapWidget extends StatelessWidget {

//   final IndexController indexController = Get.find<IndexController>();

//   MapWidget({ Key? key}) : super(key: key);

//   StreamSubscription? subscription;

//   @override
//   Widget build(BuildContext context) {

//     print("---------- rog mode is ${indexController.rog_mode.value.toString()}----------");

//     final PopupController _popupController = PopupController();
//     return Stack(
//                   children: [
//                     Obx(() => 
//                       indexController.is_loading == true ? Padding(
//                         padding: const EdgeInsets.only(top: 60.0),
//                         child: CircularProgressIndicator(),
//                       ):
//                       FlutterMap(
//                       //mapController: mapController,
//                       options: MapOptions(
//                           onMapCreated: (c){
//                             indexController.mapController = c;

//                             indexController.mapController!.onReady.then((_) {
//                             indexController.is_mapController_loaded.value = true;
//                             subscription = indexController.mapController!.mapEventStream.listen((MapEvent mapEvent) {
//                               if (mapEvent is MapEventMoveStart) {
//                                   //print(DateTime.now().toString() + ' [MapEventMoveStart] START');
//                                   // do something
//                                 }
//                                 if (mapEvent is MapEventMoveEnd) {
//                                   //print(DateTime.now().toString() + ' [MapEventMoveStart] END');
//                                   indexController.loadLocationsBound();
//                                 }
//                               });
//                             });

//                           },
//                           //center: LatLng(37.15319600454702, 139.58765950528198),
//                           bounds: indexController.currentBound.length > 0 ? indexController.currentBound[0]: LatLngBounds.fromPoints([LatLng(35.03999881162295, 136.40587119778962), LatLng(36.642756778706904, 137.95226720406063)]),
//                           zoom: 1,
//                           maxZoom: 24,
//                           interactiveFlags: InteractiveFlag.pinchZoom | InteractiveFlag.drag,
//                           plugins: [
//                             MarkerClusterPlugin(),
//                           ],
                          
//                           onPositionChanged: (MapPosition pos, isvalue){
//                           },
//                           onTap: (_, __) =>
//                               _popupController
//                                   .hideAllPopups(), // Hide popup when the map is tapped.
//                         ),
//                         children: [
//                           BaseLayer(),
//                           LocationMarkerLayerWidget(),
                          
//                           indexController.locations.length > 0 ?
//                           MarkerClusterLayerWidget(
//                             options: MarkerClusterLayerOptions(
//                               spiderfyCircleRadius: 0,
//                               spiderfySpiralDistanceMultiplier: 2,
//                               circleSpiralSwitchover: 12,
//                               maxClusterRadius: 0,
//                               rotate: true,
//                               onMarkerTap: (marker){
//                                 GeoJsonFeature? fs = indexController.getFeatureForLatLong(marker.point.latitude, marker.point.longitude);
//                                 //print("------- fs ${fs}------");
//                                 if(fs != null){
//                                   indexController.currentFeature.clear();
//                                   indexController.currentFeature.add(fs);
//                                   //print("----- fs is ${fs.properties!['photos']}");
//                                   indexController.getAction();
            
//                                   showModalBottomSheet(
//                                     context: context, 
//                                     isScrollControlled: true, 
//                                     isDismissible: true,
//                                     builder:((context) => BottomSheetNew())
//                                     //builder:((context) => BottomSheetWidget())
//                                   );
//                                 }
                                
//                               },
            
//                               size: Size(40, 40),
//                               anchor: AnchorPos.align(AnchorAlign.center),
//                               fitBoundsOptions: const FitBoundsOptions(
//                                 padding: EdgeInsets.all(50),
//                                 maxZoom: 265,
//                               ),
//                               markers:indexController.locations[0].collection.map((i) {
//                                 print("i si ${i.properties!['location_id']}");
//                                 GeoJsonMultiPoint p = i.geometry as GeoJsonMultiPoint;
//                                 print("lat is ${p.geoSerie!.geoPoints[0].latitude} and lon is ${p.geoSerie!.geoPoints[0].longitude}");
//                                 return Marker(
//                                   anchorPos: AnchorPos.align(AnchorAlign.center),
//                                   height: 22.0,
//                                   width: 22.0,
//                                   point: LatLng(p.geoSerie!.geoPoints[0].latitude, p.geoSerie!.geoPoints[0].longitude),
//                                   builder: (ctx) => Icon(Icons.pin_drop),
//                                   // builder: (ctx) => i.properties!["category"] != null ?
//                                   // ImageIcon(
//                                   //     AssetImage("assets/images/${i.properties!["category"]}.png"),
//                                   //     color: Color(0xFF3A5A98),
//                                   //     size:12.0,
//                                   // )
//                                   // : Icon(Icons.pin_drop),

//                                 );
//                               }).toList(),
//                               builder: (context, markers) {
//                                 return Container(
//                                   decoration: BoxDecoration(
//                                       borderRadius: BorderRadius.circular(20.0),
//                                       color: Colors.blue),
//                                   child: Center(
//                                     child: Text(
//                                       markers.length.toString(),
//                                       style: TextStyle(color: Colors.white),
//                                     ),
//                                   ),
//                                 );
//                               },
//                             ),
//                           ): Container(height:0,width: 0),
//                         ],
//                     )
//                     )
//                   ],
//                 );
//   }
// }