›

SwiftUI & MapBox

stephaneschwartzstephaneschwartz Membre
avril 2020 modifié dans API SwiftUI #1

Bjr @tous,

JE cherche un example de code en swiftui et mapbox où l'on place sur la carte un polygone avec 5 coordonnées et le Markers doit se positionner au dessus de la zone.

J'ai réussi à mettre une zone, mais le marker sur place en dessous.

Quelqu'un aurait une idée?

Voila ce que j'ai :

Le code pour placer la zone :

func mapView(_ mapView: MGLMapView, didFinishLoading style: MGLStyle) {
    let coordinates = [
        CLLocationCoordinate2D(latitude: xxxxxx, longitude: zzzzz),
        CLLocationCoordinate2D(latitude: xxxxx, longitude: zzzzz),
        CLLocationCoordinate2D(latitude: xxxx, longitude: zzzz),
        CLLocationCoordinate2D(latitude: xxxx, longitude: zzzzz),
        CLLocationCoordinate2D(latitude: xxxxx, longitude: zzzzzz)
        ]

        let buildingFeature = MGLPolygonFeature(coordinates: coordinates, count: 5)
        let shapeSource = MGLShapeSource(identifier: "buildingSource", features: [buildingFeature], options: nil)
        mapView.style?.addSource(shapeSource)

        let fillLayer = MGLFillStyleLayer(identifier: "buildingFillLayer", source: shapeSource)
        fillLayer.fillColor = NSExpression(forConstantValue: UIColor.blue)
        fillLayer.fillOpacity = NSExpression(forConstantValue: 0.2)

        mapView.style?.addLayer(fillLayer)

    }

et pour placer le marker :

func mapView(_ mapView: MGLMapView, imageFor annotation: MGLAnnotation) -> MGLAnnotationImage? {
    // Try to reuse the existing ‘pisa’ annotation image, if it exists.
    var annotationImage = mapView.dequeueReusableAnnotationImage(withIdentifier: "pisa")

    if annotationImage == nil {
        // Leaning Tower of Pisa by Stefan Spieler from the Noun Project.
        var image = UIImage(named: "pinuser")!

        // The anchor point of an annotation is currently always the center. To
        // shift the anchor point to the bottom of the annotation, the image
        // asset includes transparent bottom padding equal to the original image
        // height.
        //
        // To make this padding non-interactive, we create another image object
        // with a custom alignment rect that excludes the padding.
        image = image.withAlignmentRectInsets(UIEdgeInsets(top: 0, left: 0, bottom: image.size.height/2, right: 0))

        // Initialize the ‘pisa’ annotation image with the UIImage we just loaded.
        annotationImage = MGLAnnotationImage(image: image, reuseIdentifier: "pisa")
    }

    return annotationImage
}

Merci

Mots clés:

Réponses

  • RenaudRenaud Membre
    #2

    Bienvenue pour commencer ;)

    Je ne connais pas MapBox, donc je vais te répondre par une question: je vois que la fonction qui renvoie l'image pour le marker prend un objet MGLAnnotation en argument, or ta feature est une instance de MGLPolygonFeature. Qu'est-ce qui fait le lien entre les deux? Est-ce MapBox le fait de manière implicite? Si non, la solution sera probablement de créer une annotation explicitement.

  • Joanna CarterJoanna Carter Membre, Modérateur
    #3

    Stéphane, s'il te plaît utiliser le markdown pour le code

    ```
    ton code
    ```

    Ça donne

      ton code

    Je l'ai corrigé cette fois.

  • stephaneschwartzstephaneschwartz Membre
    #4

    @Joanna Carter a dit :
    Stéphane, s'il te plaît utiliser le markdown pour le code

    ```
    ton code
    ```

    Ça donne

      ton code

    Je l'ai corrigé cette fois.

    Merci

Connectez-vous ou Inscrivez-vous pour répondre.