I have a map screen where when I click on the button to draw a polygon nothing happens on the map. Is there any issue in my code files?
This is my `MapScreen`
import 'package:flutter/material.dart';
import 'package:flutter/services.dart' show rootBundle;
import 'package:mapbox_maps_flutter/mapbox_maps_flutter.dart';
class MapScreen extends StatefulWidget {
const MapScreen({super.key});
@override
State createState() => MapScreenState();
}
class MapScreenState extends State<MapScreen> {
MapboxMap? mapboxMap;
var isLight = true;
_onMapCreated(MapboxMap mapboxMap) async {
this.mapboxMap = mapboxMap;
}
void drawPolygon() async {
var data = await rootBundle.loadString('assets/mydata.geojson');
await mapboxMap!.style.addSource(GeoJsonSource(
id: "mydata",
data: data,
));
await mapboxMap!.style.addLayer(FillLayer(
id: "mydata2",
sourceId: "mydata",
fillColor: Colors.red.value,
fillOutlineColor: Colors.deepPurple.value));
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
SizedBox(
height: 500,
child: MapWidget(
key: const ValueKey("mapWidget"),
styleUri: MapboxStyles.DARK,
cameraOptions: CameraOptions(
center: Point(coordinates: Position(78.042, 30.3165)),
zoom: 14.0),
onMapCreated: _onMapCreated,
),
),
ElevatedButton(
onPressed: drawPolygon,
child: const Text("Draw Polygon"),
),
],
));
}
}
and this is my mydata.geojson
file
{
"data": {
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[78.042, 30.3165],
[78.042, 30.3163],
[78.043, 30.3166],
[78.044, 30.3164],
[78.042, 30.3165],
[78.043, 30.3166],
[78.044, 30.3164],
[78.042, 30.3163],
[78.042, 30.3165]
]
]
}
}
]
}
}
But when I click on the button to draw the polygon nothing happens on the map and I’m not getting any error on the console side neither.
New contributor
Ali Raza Dar is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.