I am creating a component that displays the current users accounts on a map. The map markers are not displaying. Am I overlooking something?
<template>
<div class="slds-m-around_medium">
<template if:true={mapMarkers}>
<lightning-map
map-markers={mapMarkers}
markers-title={markersTitle}
list-view={listView}
>
</lightning-map>
</template>
</div>
import { LightningElement, track, wire } from 'lwc';
import Id from '@salesforce/user/Id';
import getUsersAccounts from '@salesforce/apex/AccountLocationController.getUsersAccounts';
export default class AccountMP extends LightningElement {
@track mapMarkers;
@track data;
@track error;
userId = Id;
@wire(getUsersAccounts, {uId: '$userId'})
wiredAccounts({error, data}){
if(data) {
this.mapMarkers = [
{
location: {
Street: data.BillingStreet,
City: data.BillingCity,
PostalCode: data.BillingPostalCode,
State: data.BillingState,
Country: data.BillingCountry,
},
title: data.Name,
},
];
this.error = undefined;
console.log('this.mapMarkers => ', JSON.stringify(this.mapMarkers));
} else if (error) {
this.error = error;
this.mapMarkers = undefined;
console.error('ERROR => ', error);
}
}
listView = 'visible';
}
public with sharing class AccountLocationController {
@AuraEnabled(Cacheable = true)
public static List<Account> getUsersAccounts(Id uId){
return [
SELECT Id, Name, BillingStreet, BillingCity, BillingPostalCode, BillingState, BillingCountry
FROM Account
WHERE OwnerId = :uId
];
}
}