rnmapbox / rnmapbox/maps

[Bug]: Geting Error "mapbox::util::bad_variant_access" while cluster is enable for the "Point" and "Polygon" geo json data.

Open
#3,662 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug 🪲
Dominant language
Kotlin
Stars
2.9k
Forks
947
Avg merge
6d 37m
Merged PRs (30d)
1

Description

Mapbox Implementation

Mapbox

Mapbox Version

default

React Native Version

0.71.8

Platform

iOS, Android

@rnmapbox/maps version

10.1.31

Standalone component to reproduce
import MapboxGL, { MapView } from "@rnmapbox/maps";
import React from "react";

const MapScreen = () => {
  const GEO_JSON = [
    //link attched in description
  ];

  return (
    <MapView requestDisallowInterceptTouchEvent style={{ flex: 1 }}>
      <MapboxGL.ShapeSource
        id="hangoutMarkers"
        onPress={() => {}}
        cluster
        clusterRadius={50}
        clusterMaxZoomLevel={16}
        shape={GEO_JSON}
      >
        <MapboxGL.SymbolLayer
          id="singlePoint"
          filter={["==", ["geometry-type"], "Point"]}
          style={{
            iconImage: ["get", "icon"],
            iconSize: 0.2,
            iconAllowOverlap: false,
          }}
        />
        <MapboxGL.SymbolLayer
          filter={["==", ["geometry-type"], "Point"]}
          id="pointCount"
          style={{
            textField: [
              "format",
              ["concat", ["get", "point_count"], "\n"],
              {},
              ["concat"],
              { "font-scale": 0.8 },
            ],
            textSize: 12,
            textPitchAlignment: "map",
          }}
        />
        <MapboxGL.CircleLayer
          id="clusteredPoints"
          belowLayerID="pointCount"
          filter={["has", "point_count"]}
          // style={layerStyles.clusteredPoints}
        />
        <MapboxGL.FillLayer
          id="polygonFillLayer"
          filter={["==", ["geometry-type"], "Polygon"]}
          style={{
            fillColor: "black",
          }}
        />
        <MapboxGL.LineLayer
          id="polygonLineLayer"
          filter={["==", ["geometry-type"], "Polygon"]}
          style={{
            lineColor: "black",
            lineWidth: 2,
            lineDasharray: [1, 0],
          }}
        />
      </MapboxGL.ShapeSource>
    </MapView>
  );
};

export default MapScreen


Observed behavior and steps to reproduce

When multi type features is there (Point and Polygon) in GEO JSON and clustering is enable from the MapboxGL.ShapeSource then App going to crash and giving error for the "bad variant access". When I am commenting the clustering props in the MapboxGL.ShapeSource then is working and show the Point and Polygon view on the Map view.

Expected behavior

Clustering should work with the "Point" and "Polygon".

Notes / preliminary analysis

No response

Additional links and references

GEO JSON Link : https://drive.google.com/file/d/17vgyPMDGxT_4uIVBndTXmh0WfIDb3vZn/view?usp=sharing

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the standalone MapScreen reproduction and the ShapeSource configuration shown in the issue, then inspect the native clustering path used by @rnmapbox/maps on iOS and Android. Reproduce with the linked GeoJSON containing Point and Polygon features, and confirm that enabling clustering no longer causes the bad_variant_access crash while both geometry types still render.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.