OwnWeb / map_elevation

A widget to display elevation of a track (polyline) like Leaflet.Elevation
MIT License
28 stars 9 forks source link

Not able to click on markers after using polylines #10

Open Zeeshan0201 opened 2 years ago

Zeeshan0201 commented 2 years ago
 FlutterMap(
      options: MapOptions(
        onTap: onTap,
        bounds: widget.bounds,
        onPositionChanged:
            widget.onPositionChanged != null ? onPositionChanged : null,
        onMapCreated: onMapCreated,
        center: center,
        zoom: widget.zoom,
        interactiveFlags: widget.interactiveFlags,
        maxZoom: widget.maxZoom,
        minZoom: widget.minZoom,
        plugins: [
          MarkerClusterPlugin(),
        ],
      ),
      layers: [
        PolylineLayerOptions(
          polylines: [
            Polyline(
              points: [
                LatLng(37.33233141, -122.0312186),
                LatLng(37.23233141, -121.0312186),
                LatLng(37.13233141, -125.0312186),
                LatLng(37.43233141, -127.0312186),
                LatLng(37.53233141, -129.0312186),
                LatLng(38.13233141, -137.0312186),
                LatLng(50.23233141, -139.0312186),
              ],
              color: Colors.blue,
              strokeWidth: 3.0,
            ),
          ],
        ),
      ],
      children: [
        TileLayerWidget(
          options: openStreetMapLayerOptions,
        ),
        PopupMarkerLayerWidget(
          options: PopupMarkerLayerOptions(
            markerCenterAnimation: const MarkerCenterAnimation(),
            markers: _getMarkers(isPopUp: true),
            popupSnap: PopupSnap.markerTop,
            popupController: _popupLayerController,
            popupBuilder: (BuildContext context, Marker marker) =>
                widget.getCustomWidget!(marker),
            markerRotate: widget.rotate,
            markerRotateAlignment:
                PopupMarkerLayerOptions.rotationAlignmentFor(AnchorAlign.top),
            popupAnimation: const PopupAnimation.fade(
                duration: Duration(milliseconds: 700)),
            markerTapBehavior: MarkerTapBehavior.togglePopup(),
          ),
        ),
        widget.isClusterEnable
            ? MarkerClusterLayerWidget(
                options: MarkerClusterLayerOptions(
                  spiderfyCircleRadius: widget.spiderfyCircleRadius,
                  spiderfySpiralDistanceMultiplier: 2,
                  circleSpiralSwitchover: 12,
                  maxClusterRadius: widget.maxClusterRadius,
                  rotate: widget.rotate,
                  size: Size(widget.clusterSize, widget.clusterSize),
                  anchor: AnchorPos.align(AnchorAlign.center),
                  fitBoundsOptions: const FitBoundsOptions(
                    padding: EdgeInsets.all(50),
                    maxZoom: 15,
                  ),
                  markers: _getMarkers(isPopUp: false),
                  showPolygon: true,
                  polygonOptions: PolygonOptions(
                      borderColor: ColorsSet.blue,
                      color: ColorsSet.lightGrayN25,
                      borderStrokeWidth: 3),
                  builder: (context, markers) {
                    return Container(
                      decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(20.0),
                          color: ColorsSet.blue),
                      child: Center(
                        child: Text(
                          markers.length.toString(),
                          style: TextStyle(color: ColorsSet.white),
                        ),
                      ),
                    );
                  },
                ),
              )
            : MarkerLayerWidget(
                options:
                    MarkerLayerOptions(markers: _getMarkers(isPopUp: false))),
        isInProgress
            ? const Positioned(
                top: 10,
                right: 10,
                child: CircularProgressIndicator(),
              )
            : const SizedBox.shrink(),
      ],
    );
  }

  /// Options for OpenStreetMap provider
  /// to change follow instruction: https://pub.dev/packages/flutter_map
  TileLayerOptions get openStreetMapLayerOptions {
    return TileLayerOptions(
      urlTemplate: _tileUrlTemplate,
      subdomains: ['a', 'b', 'c'],
      attributionBuilder: (_) {
        return const Text(
          "© OpenStreetMap contributors",
          overflow: TextOverflow.ellipsis,
        );
      },
    );
  }