Custom Marker Display Issues in FlutterFlow Web with Google Maps SDK

Custom Code

I'm encountering an issue in my FlutterFlow application where custom markers are not displaying on Flutter Web, although default markers work as expected. In the Google Maps Web SDK, some functionalities, such as custom markers, are split into separate libraries (e.g., the drawing library). Typically, we would include this library by adding the following script:

<script src='https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=drawing'></script>

However, FlutterFlow does not offer an option to directly include this script. How can I resolve this issue and ensure that custom markers are displayed correctly?

What have you tried so far?

I have attempted several solutions, including upgrading dependencies and making various code adjustments, but the issue remains unresolved. I tested the implementation on my local server, where it works perfectly—both default and custom markers display as expected. However, when I deploy the application through FlutterFlow for the web, only the default markers appear, and the custom markers are not visible. My goal is to ensure that custom markers are displayed correctly in my FlutterFlow web application.

Did you check FlutterFlow's Documentation for this topic?

Yes

2 replies