LWC SuperBadge Challenge 7 boatsNearMe Error

Question

My component works fine and I can see it is working properly with the maps being formed in UI and markers coming up properly, however I am still get this error for the challenge :

Challenge Not yet complete... here's what's wrong: We can't find the correct settings for the createMapMarkers() function in the component boatsNearMe JavaScript file. Make sure the component was created according to the requirements, including the right mapMarkers, title, Latitude (Geolocation__Latitude__s), Longitude (Geolocation__Longitude__s), the correct constants, stopping the loading spinner, and using the proper case-sensitivity and consistent quotation.

This is the Challenge 7 Statement as per the trailhead:

"Build the component boatsNearMe and display boats near you Create the component boatsNearMe and show boats that are near the user, using the browser location and boat type. Display them on a map, always with the consent of the user (and only while the page is open)." https://trailhead.salesforce.com/en/content/learn/superbadges/superbadge_lwc_specialist

Here is my boatsNearMe LWC code

import { LightningElement, wire, api } from 'lwc';
import getBoatsByLocation from '@salesforce/apex/BoatDataService.getBoatsByLocation';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

const LABEL_YOU_ARE_HERE = 'You are here!';
const ICON_STANDARD_USER = 'standard:user';
const ERROR_TITLE = 'Error loading Boats Near Me';
const ERROR_VARIANT = 'error';

export default class BoatsNearMe extends LightningElement {
    @api boatTypeId;
    mapMarkers = [];
    isLoading = true;
    isRendered = false;
    latitude;
    longitude;

    @wire(getBoatsByLocation, { latitude: '$latitude', longitude: '$longitude', boatTypeId: '$boatTypeId' })
    wiredBoatsJSON({ error, data }) {
        
        if (data) {
            this.isLoading = true;
            this.createMapMarkers(JSON.parse(data));
            
        } else if (error) {
            this.dispatchEvent(
                new ShowToastEvent({
                    title: ERROR_TITLE,
                    message: error.body.message,
                    variant: ERROR_VARIANT
                })
            );
           // this.isLoading = false;
        }
    }

    getLocationFromBrowser() {
        navigator.geolocation.getCurrentPosition(
            position => {
                this.latitude = position.coords.latitude;
                this.longitude = position.coords.longitude;
            },
            (error) => {}
        );
    }

    createMapMarkers(boatData) {

        const newMarkers = boatData.map((boat) => {
            return {
                location: {
                    Latitude: boat.Geolocation__Latitude__s,
                    Longitude: boat.Geolocation__Latitude__s
                },
                title: boat.Name,
            };
        });

        newMarkers.unshift({
            location: {
                Latitude: this.latitude,
                Longitude: this.longitude
            },
            title: LABEL_YOU_ARE_HERE,
            icon: ICON_STANDARD_USER
        });

        this.mapMarkers = newMarkers;
        this.isLoading = false;

    }

    renderedCallback() {
        if (this.isRendered == false) {
            this.getLocationFromBrowser();
        }
        this.isRendered = true;
    }
}

the error says, "Make sure the component was created according to the requirements"... so you might want to post the requirements here as well... — Argee, Aug 04 '20 at 09:13
Updated the Questions with the Challenge statement and trailhead link. — Artee Rawat, Aug 09 '20 at 17:19

score 3 · Accepted Answer · edited Aug 28 '20 at 20:48

3

I think you have Geolocation__Latitude__s twice in this part:

    createMapMarkers(boatData) {

        const newMarkers = boatData.map((boat) => {
            return {
                location: {
                    Latitude: boat.Geolocation__Latitude__s,
                    Longitude: boat.Geolocation__Latitude__s // <<-- should be Longitude
                },
                title: boat.Name,
            };
        });

edited Aug 28 '20 at 20:48

Nowhere Man

19,170
9
17
42

answered Aug 27 '20 at 15:20

Fab

56
1

Look, this doesn't solve the bigger problem being asked about, but it definitely cleans up another error that's going to cause problems rather quickly. I think this answer still has some merit. – torpy Aug 31 '20 at 18:41
‍♂️ Copy/paste error... can't believe it. THANK YOU! – MayTheSForceBeWithYou Apr 13 '23 at 20:15

LWC SuperBadge Challenge 7 boatsNearMe Error

1 Answers1