Apex Code Development You need to sign in to do that
Don't have an account?
Help with the error:
Component:
<aura:component>
<aura:handler event="c:AccountsLoaded" action="{!c.onAccountsLoaded}"/>
<aura:attribute name="map" type="Object"/>
<aura:attribute name="accounts" type="Account" />
<ltng:require styles="/resource/leaflet/leaflet.css" scripts="/resource/leaflet/leaflet.js" afterScriptsLoaded="{!c.jsLoaded}" />
<div id="map"/>
</aura:component>
JS:
({
jsLoaded: function(component, event, helper) {
var accounts = event.getParam('accounts');
for (var i=0; i<accounts.length; i++) {
var account = accounts[i];
var map = L.map('map', {zoomControl: false}).setView([account.BillingLatitude, account.BillingLongitude],11);
L.tileLayer(
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}', {
}).addTo(map);
component.set("v.map", map);
var circle = L.circle([account.BillingLatitude, account.BillingLongitude], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius:10000
}).addTo(map);
L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup(account.Name).openPopup();
//L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup('Hyatt').openPopup();
//L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup('Marriott Marquis').openPopup();
}
}
})
Error:
This page has an error. You might just need to refresh it. Action failed: c:leafflet$controller$jsLoaded [Unable to get property 'length' of undefined or null reference] Failing descriptor: {c:leafflet}
<aura:component>
<aura:handler event="c:AccountsLoaded" action="{!c.onAccountsLoaded}"/>
<aura:attribute name="map" type="Object"/>
<aura:attribute name="accounts" type="Account" />
<ltng:require styles="/resource/leaflet/leaflet.css" scripts="/resource/leaflet/leaflet.js" afterScriptsLoaded="{!c.jsLoaded}" />
<div id="map"/>
</aura:component>
JS:
({
jsLoaded: function(component, event, helper) {
var accounts = event.getParam('accounts');
for (var i=0; i<accounts.length; i++) {
var account = accounts[i];
var map = L.map('map', {zoomControl: false}).setView([account.BillingLatitude, account.BillingLongitude],11);
L.tileLayer(
'https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}', {
}).addTo(map);
component.set("v.map", map);
var circle = L.circle([account.BillingLatitude, account.BillingLongitude], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius:10000
}).addTo(map);
L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup(account.Name).openPopup();
//L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup('Hyatt').openPopup();
//L.marker([account.BillingLatitude, account.BillingLongitude]).addTo(map).bindPopup('Marriott Marquis').openPopup();
}
}
})
Error:
This page has an error. You might just need to refresh it. Action failed: c:leafflet$controller$jsLoaded [Unable to get property 'length' of undefined or null reference] Failing descriptor: {c:leafflet}
In your case, you first need to query record/s in init method and initialise the list. Rest your code looks good.
All Answers
var accounts = event.getParam('accounts'); to var accounts = component.get('v.accounts');But it will return you only single record. If you want multiple then you need to convert aura:attribute into a list
You didn't shared your init method so I am hoping you are querying record in that.
If this answer helps you, please mark it as accepted.
Regards,
Tushar Sharma
https://newstechnologystuff.com/
Where am I going wrong??
I am pretty new to this aura components and coding can you help me further??
<aura:attribute name="accounts" type="List" />
2. I don't see aura attribute accounts being initialized. Initialization usually takes place in init method. If init is not used. You are trying to loop on a undefined object, that is why you get a blank screen.
In your case, you first need to query record/s in init method and initialise the list. Rest your code looks good.