mapbox / mapbox/mapbox-maps-flutter

Tapped layer color change using layer's id within properties

Aperta
#654 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Lingua principale
Dart
Stelle
380
Fork
204
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Descrizione

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.

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia dal punto di ingresso onTapListener e segui FillLayer fillColorExpression insieme alle chiamate a setFeatureState per pond_boundary_tile1_source e ponds_WG_b2-2ttlya. Verifica che l'identificatore della feature toccata utilizzato per lo stato corrisponda all'identificatore previsto dal layer, quindi conferma che lo stagno selezionato cambi in #E27E1E mentre gli altri stagni mantengono i loro colori.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
dart, flutter
Ambito
mobile-dev
Tipo di issue
Bug
Difficoltà
3/5
Tempo stimato
1-2 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
42/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.