mapbox / mapbox/mapbox-maps-flutter

Tapped layer color change using layer's id within properties

Offen
#654 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Vorherrschende Sprache
Dart
Sterne
380
Forks
204
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

I am trying to change the tapped layer color only using pond_id inside my layer response.. when i tap the feature state returns true but the color is not changing "#E27E1E", my featuredata of tapped layer id :

Tapped feature ID: {type: Feature, id: 22, geometry: {type: Polygon, coordinates: [[[81.4860383, 16.5046304], [81.4888948, 16.5045532], [81.4888412, 16.5036197], [81.4868027, 16.5036557], [81.4862716, 16.5036248], [81.4860383, 16.5046304]]]}, properties: {pond_id: 16108c29-e6eb-4ee6-94a1-56c8a16cc167}}

`await mapboxMap?.style.addLayer(
FillLayer(
id: 'pond_boundary_tile1_fill',
sourceId: 'pond_boundary_tile1_source',
sourceLayer: 'ponds_WG_b2-2ttlya',
fillColorExpression: [
'case',
[
'boolean',
['feature-state', 'selected'],
false
],
"#E27E1E",
[
"in",
["get", "pond_id"],
["literal", allPondIds]
],
"#004fbb",
"#DBDBDB",
],
),
);

Future onTapListener(MapContentGestureContext context,
Function(bool) onFeatureSelected) async {
final touchPosition = context.touchPosition;
// print("Coordinates: (${touchPosition.x}, ${touchPosition.y})");

final List<QueriedRenderedFeature?> features =
await mapboxMap!.queryRenderedFeatures(
RenderedQueryGeometry(
value: jsonEncode(touchPosition.encode()),
type: Type.SCREEN_COORDINATE,
),
RenderedQueryOptions(
layerIds: ['pond_boundary_tile1_fill'], filter: null),
);

if (features.isNotEmpty) {
final QueriedFeature selectedFeature = features.first!.queriedFeature;
final featureData = selectedFeature.feature;

final featureModel = FeatureModel.fromJson(
Map<String, dynamic>.from(featureData),
);

isLoading.value = true;

final pondId = featureModel.tappedId;

print("Tapped feature properties ID: $pondId");

featureId.value = selectedFeature.feature['id'].toString();

print("Tapped feature ID: $featureData");

appController.setFeatureId = submittedId;

// selectedFeatureId = featureId.value;

if (selectedFeatureId != null && selectedFeatureId != pondId) {
mapboxMap?.setFeatureState(
'pond_boundary_tile1_source',
'ponds_WG_b2-2ttlya',
selectedFeatureId!,
jsonEncode({'selected': false}),
);
}
print("Setting feature state for pondId: $pondId");
mapboxMap?.setFeatureState(
'pond_boundary_tile1_source',
'ponds_WG_b2-2ttlya',
pondId,
jsonEncode({'selected': true}),
);

final featureState = await mapboxMap?.getFeatureState(
'pond_boundary_tile1_source',
'ponds_WG_b2-2ttlya',
pondId,
);

print("Updated Feature state: $featureState");

}
}
}`

please help me to fix asap.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginnen Sie am Einstiegspunkt onTapListener und verfolgen Sie den FillLayer fillColorExpression zusammen mit den setFeatureState-Aufrufen für pond_boundary_tile1_source und ponds_WG_b2-2ttlya. Überprüfen Sie, ob die für den Status verwendete Kennung des angetippten Features mit der vom Layer erwarteten Kennung übereinstimmt, und bestätigen Sie anschließend, dass der ausgewählte Teich zu #E27E1E wechselt, während die anderen Teiche ihre Farben behalten.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
dart, flutter
Bereich
mobile-dev
Issue-Typ
Bug
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
42/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.