Apex Code Development You need to sign in to do that
Don't have an account?
Getting this error Uncaught Error in $A.getCallback() [Cannot read property 'createIcon' of undefined] Callback failed: apex://accountvisualiser/ACTION$getAccounts
apex class
Component
Debugger
public class accountvisualiser {
@AuraEnabled
public static List<Account> getAccounts() {
return [
SELECT id, Name, BillingLatitude, BillingLongitude, Package__c
FROM Account
WHERE BillingLatitude != NULL AND BillingLongitude != NULL AND Package__c != NULL
];
}
}
Component
<aura:component implements="force:appHostable" controller="accountvisualiser">
<aura:attribute name="accounts" type="Account[]" />
<ltng:require styles="/resource/leaflet/leaflet.css" />
<ltng:require scripts="/resource/leaflet/leaflet.js" afterScriptsLoaded="{!c.mapLoaded}" />
<div class="map" id="map"></div>
</aura:component>
Controller
({
mapLoaded: function(component, event, helper) {
var accountsAction = component.get("c.getAccounts");
var accounts = {};
var map = window.L.map("map", {zoomControl: true, center: [0.00, -0.00], zoom: 14});
var userPosition;
var userLatLng;
var accountPopups = [];
// https://github.com/pointhi/leaflet-color-markers
var redIcon = new L.Icon({
iconUrl: "https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-red.png",
shadowUrl: "https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png",
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var greenIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-green.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var blueIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-blue.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var orangeIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-orange.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var yellowIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-yellow.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var violetIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-violet.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var greyIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-grey.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
var blackIcon = new L.Icon({
iconUrl: 'https://cdn.rawgit.com/pointhi/leaflet-color-markers/master/img/marker-icon-2x-black.png',
shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
// Draw the map
window.L.tileLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}",
{
attribution: "Tiles © Esri"
}).addTo(map);
// Center the map
map.locate({watch: true, setView: true, maxZoom: 14});
// Draw the user
userLatLng = map.getCenter();
userPosition = L.marker([userLatLng.lat, userLatLng.lng], {icon: redIcon}).addTo(map);
// Draw the markers, including links to the Account records
// - Whenever a popup is opened, call the function
console.log(accountsAction);
accountsAction.setCallback(
this,
function(response) {
var state = response.getState();
if (component.isValid() && state === "SUCCESS") {
accounts = response.getReturnValue();
// Package__c Enterprise and Pro
component.set("v.accounts", accounts);
// Get all Accounts, plot as Markers by package type
for (var i = 0; i < accounts.length; i++) {
if (accounts[i].BillingLatitude !== null && accounts[i].BillingLongitude !== null ) {
let dynIcon;
// Enterprise
if (accounts[i].Package__c === 'Enterprise'){ dynIcon = orangeIcon }
// Pro
if (accounts[i].Package__c === 'Pro'){ dynIcon = yellowIcon }
// Pro
if (accounts[i].Package__c === 'Pro - Single'){ dynIcon = yellowIcon }
// Pro
if (accounts[i].Package__c === 'IAP Precision Pro'){ dynIcon = yellowIcon }
// Advanced
if (accounts[i].Package__c === 'Advanced'){ dynIcon = violetIcon }
// Advanced
if (accounts[i].Package__c === 'Advanced - Single'){ dynIcon = violetIcon }
// Advanced
if (accounts[i].Package__c === 'IAP Location Pro'){ dynIcon = violetIcon }
// Core
if (accounts[i].Package__c === 'Core'){ dynIcon = greyIcon }
// Core
if (accounts[i].Package__c === 'IAP Field Pro'){ dynIcon = greyIcon }
// 750
if (accounts[i].Package__c === '750'){ dynIcon = blackIcon }
// Legacy
if (accounts[i].Package__c === 'Legacy (CG)'){ dynIcon = blueIcon }
// Legacy
if (accounts[i].Package__c === 'Free'){ dynIcon = redIcon }
// Fallback
if (accounts[i].Package__c == ''){ dynIcon = greenIcon }
accountPopups[i] = L.marker([accounts[i].BillingLatitude, accounts[i].BillingLongitude],{icon:dynIcon})
.bindPopup("<a href=\"/one/one.app#/sObject/" +
accounts[i].Id + "/view\">" + accounts[i].Name + "<br />" + accounts[i].Package__C
)
.addTo(map);
}
}
}
// Update the user position whenever the map center updates
map.on("locationfound", function(e) {
userPosition.setLatLng(e.latlng);
userLatLng = map.getCenter();
if (accountPopups !== null && accountPopups !== undefined) {
for (var i = 0; i < accountPopups.length; i++) {
accountPopups[i].setPopupContent("<a href=\"/one/one.app#/sObject/" +
accounts[i].Id + "/view\">" + accounts[i].Name + "<br />" + accounts [i].Package__c ) ;
}
}
});
}
);
$A.enqueueAction(accountsAction);
}
})
Debugger
48.0 APEX_CODE,FINEST;APEX_PROFILING,INFO;CALLOUT,INFO;DB,INFO;NBA,INFO;SYSTEM,DEBUG;VALIDATION,INFO;VISUALFORCE,INFO;WAVE,INFO;WORKFLOW,INFO 10:38:23.0 (515844)|USER_INFO|[EXTERNAL]|00530000004r9pe|colby@agrian.com.multic|(GMT-08:00) Pacific Standard Time (America/Los_Angeles)|GMT-08:00 10:38:23.0 (566697)|EXECUTION_STARTED 10:38:23.0 (574104)|CODE_UNIT_STARTED|[EXTERNAL]|Aura 10:38:23.0 (1798660)|CODE_UNIT_STARTED|[EXTERNAL]|01p2f000000KJ2h|accountvisualiser.getAccounts() 10:38:23.0 (2049690)|HEAP_ALLOCATE|[79]|Bytes:3 10:38:23.0 (2123965)|HEAP_ALLOCATE|[84]|Bytes:152 10:38:23.0 (2150331)|HEAP_ALLOCATE|[399]|Bytes:408 10:38:23.0 (2175515)|HEAP_ALLOCATE|[412]|Bytes:408 10:38:23.0 (2195455)|HEAP_ALLOCATE|[520]|Bytes:48 10:38:23.0 (2232359)|HEAP_ALLOCATE|[139]|Bytes:6 10:38:23.0 (2301512)|HEAP_ALLOCATE|[EXTERNAL]|Bytes:1 10:38:23.0 (2318584)|METHOD_ENTRY|[1]|01p2f000000KJ2h|accountvisualiser.accountvisualiser() 10:38:23.0 (2327958)|STATEMENT_EXECUTE|[1] 10:38:23.0 (2336106)|STATEMENT_EXECUTE|[1] 10:38:23.0 (2343723)|METHOD_EXIT|[1]|accountvisualiser 10:38:23.0 (2365426)|SYSTEM_MODE_ENTER|false 10:38:23.0 (2378367)|STATEMENT_EXECUTE|[3] 10:38:23.0 (2382043)|STATEMENT_EXECUTE|[4] 10:38:23.0 (2390700)|HEAP_ALLOCATE|[4]|Bytes:159 10:38:23.0 (2420474)|HEAP_ALLOCATE|[4]|Bytes:4 10:38:23.0 (2470802)|HEAP_ALLOCATE|[52]|Bytes:5 10:38:23.0 (2503624)|HEAP_ALLOCATE|[58]|Bytes:5 10:38:23.0 (2515672)|HEAP_ALLOCATE|[66]|Bytes:7 10:38:23.0 (3985219)|SOQL_EXECUTE_BEGIN|[4]|Aggregations:0|SELECT id, Name, BillingLatitude, BillingLongitude, Package__c FROM Account WHERE (BillingLatitude != NULL AND BillingLongitude != NULL AND Package__c != NULL) 10:38:23.0 (95328061)|SOQL_EXECUTE_END|[4]|Rows:1527 10:38:23.0 (95407080)|HEAP_ALLOCATE|[4]|Bytes:6112 10:38:23.0 (100236588)|HEAP_ALLOCATE|[4]|Bytes:314102 10:38:23.0 (100406959)|HEAP_ALLOCATE|[4]|Bytes:6112 10:38:23.0 (100438703)|SYSTEM_MODE_EXIT|false 10:38:23.100 (100497450)|CUMULATIVE_LIMIT_USAGE 10:38:23.100 (100497450)|LIMIT_USAGE_FOR_NS|(default)| Number of SOQL queries: 1 out of 100 Number of query rows: 1527 out of 50000 Number of SOSL queries: 0 out of 20 Number of DML statements: 0 out of 150 Number of DML rows: 0 out of 10000 Maximum CPU time: 0 out of 10000 Maximum heap size: 0 out of 6000000 Number of callouts: 0 out of 100 Number of Email Invocations: 0 out of 10 Number of future calls: 0 out of 50 Number of queueable jobs added to the queue: 0 out of 50 Number of Mobile Apex push calls: 0 out of 10 10:38:23.100 (100497450)|CUMULATIVE_LIMIT_USAGE_END 10:38:23.0 (100546448)|CODE_UNIT_FINISHED|accountvisualiser.getAccounts() 10:38:23.0 (120885997)|CODE_UNIT_FINISHED|Aura 10:38:23.0 (123321283)|EXECUTION_FINISHED