Append a Text after an Image as ViewMapAnnotation not showed

[Nickbarbieri1]

I'm trying to use Map library to implement a Map where is showed some ViewMapAnnotation, as much as the user wants to show, but I'm not able to show a simple Text under the Image that represents the single annotation

This is my code for the map implementation:

Map(coordinateRegion: $searchService.region,
type: selectedMapStyle,
pointOfInterestFilter: .excludingAll,
informationVisibility: .default.union(.userLocation),
interactionModes: .all,
userTrackingMode: $userTracking,
annotationItems: selectedLandmark,
annotationContent: { location in
ViewMapAnnotation(coordinate: location.coordinate, title: location.name) {
VStack{
Image(systemName: "mappin.circle.fill")
.foregroundColor(.red)
.font(.title)
.padding()

                            Text("\(location.name)")
                                .font(.caption2)
                        }
                    }
                },
                    overlays:  renderRoutes.map {$0.polyline},
                    overlayContent: {overlay in
                    RendererMapOverlay(overlay: overlay) {_, overlay in
                        guard let polyline = overlay as? MKPolyline else {
                            assertionFailure("Unknown overlay type encountered!")
                            return MKOverlayRenderer(overlay: overlay)
                        }
                        let isAndataRoute = polyline === andataRoutes.first?.polyline
                        let renderer = MKPolylineRenderer(polyline: polyline)
                        renderer.lineWidth = 4
                        renderer.strokeColor = isAndataRoute ? .systemBlue : .systemCyan
                        updateRectRegion(rectangle: overlay.boundingMapRect)
                        return renderer
                    }
                }
                )
                .ignoresSafeArea()
                .background(
                    RoundedRectangle(cornerRadius: 30)
                )

I really hope that someone can help me because this is a project that I'm developing for the final exam at university 😄
P.S. Sorry, but I'm not able to use properly the code function of GitHub because every time that I paste the code, GitHub adds to it a lot of tab at the beginning of every line

[pauljohanneskraft]

Hey - what happens, if you put .fixedSize(horizontal: false, vertical: true) on that VStack? You might also want to simply define a fixed width using the frame view modifier.

If this doesn't work, you might want to have a look at the two currently open PRs handling a similar issue #40 #25 - I haven't tested them yet unfortunately.

If both of them don't work, you might want to build a custom annotation by creating a new type conforming to the MapAnnotation protocol. Take a look at MapPin or MapMarker implementations for some inspiration. The ViewMapAnnotation is a bit more complicated, but it might also help - especially if you still want to use SwiftUI for the content.