You need to sign in to do that
Don't have an account?
Jake Irvin
Account Geolocation Project 'Using Events to Center the Map'
I'm passing this challenge, however when I actually test it out by clicking on an account in the account list item, I get this exception:
"Something has gone wrong. Action failed: c$AccountMap$controller$accountSelected [TypeError: Cannot read property 'reuseTiles' of undefined] Failing descriptor: {c$AccountMap$controller$accountSelected}."
I did some debugging and found that the location and latitude of the account are indeed being capture by my event, so it looks like this might be a problem with the leaflet function map.panTo(). Does anyone know the solution to this issue? Here's my code, although it's exactly the same as the tutorial's.
"Something has gone wrong. Action failed: c$AccountMap$controller$accountSelected [TypeError: Cannot read property 'reuseTiles' of undefined] Failing descriptor: {c$AccountMap$controller$accountSelected}."
I did some debugging and found that the location and latitude of the account are indeed being capture by my event, so it looks like this might be a problem with the leaflet function map.panTo(). Does anyone know the solution to this issue? Here's my code, although it's exactly the same as the tutorial's.
({ jsLoaded: function(component, event, helper) { setTimeout(function() { var map = L.map('map', {zoomControl: false}).setView([37.784173, -122.401557], 14); L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}', { attribution: 'Tiles © Esri' }).addTo(map); component.set("v.map", map); }); }, accountsLoaded: function(component, event, helper) { // Add markers var map = component.get('v.map'); var accounts = event.getParam('accounts'); for (var i=0; i<accounts.length; i++) { var account = accounts[i]; var latLng = [account.Location__Latitude__s, account.Location__Longitude__s]; L.marker(latLng, {account: account}).addTo(map); } }, accountSelected: function(component, event, helper) { // Center the map on the account selected in the list var map = component.get('v.map'); var account = event.getParam("account"); alert(account.Location__Latitude__s + ', ' + account.Location__Longitude__s); map.panTo([account.Location__Latitude__s, account.Location__Longitude__s]); } })
Have you found a solution? I'm having the exact same issue ... Passing the step, but also getting the exception when testing.
Kind regards,
Benny
Jeff Douglas
Trailhead Developer Advocate
Much appreciate
you should have no problems using leaflet. Once the bug is resolved this should not be needed as panTo and fitBounds will work as expected (I hope!).
Just to confirm, still having the issue:
Something has gone wrong. Action failed: sty$AccountMap$controller$accountSelected [TypeError: Cannot read property 'reuseTiles' of undefined]
Failing descriptor: {sty$AccountMap$controller$accountSelected}.
Please try again.
Please let us know if there is any solution
Regards
Siva
The exception is due to Lockerservice on. If we deactivate the Lockerservice. Its working.
Regards,
Yogaraj.K.v
Even when I turn of Lockerservice, I receive an error message since release of Winter 17 in Production, see below for Technical Stuff Message.
Also, the markers for the accounts are not showing anymore, while they did before.
I looked at the event component en controller of the AccountMap component, and they are still exactly the same as described in the Trailhead Project.
Kind Regards,
Benny
Uncaught Action failed: c$AccountMap$controller$accountsLoaded [Cannot read property 'addLayer' of null]
I fixed this by moving the map generation code to the accountsLoaded function .
But now I get an error when I navigate to another page then back to the Home page, the accountsLoaded function fires two times and I get this error:
Uncaught Action failed: c$AccountMap$controller$accountsLoaded [Map container is already initialized.]
Why is the accountsLoaded function executing two times when you use the the tab navigation menu?
One workaround was explained in this Dreamforce session "Using 3rd Party JS Libraries With Lightning Components (https://www.salesforce.com/video/303933/)".
They ended up creating a VF page containing the Leaflet map and embedding it in an IFRAME inside the Lightning component, then passing arguments to the IFRAME.
Another workaround is posted below: delete and recreate the map on the accountSelected event.
Please note that I've declared an account list on a new component attribute 'accountList'
and then changed the accountsLoaded event to copy the accounts to it
then changed the accountSelected event as below to recreate the map and restore the markers:
There is still a glitch: the map stops responding to the mouse drag and doesn't scroll.
This is my first step into the world of Lightning with Trailhead and I have to wonder if I'm being taught to do things wrongly or if it's due to frameworks which are out of the control of the Trailhead Team.
Either way, this trailhead needs overhauling or deleting.
I was able to resolve it by activating the CSP critical update. Once I activated it, the map and markers appear to work properly.
The Critical Update Name that you should activate is:
Enable Stricter Content Security Policy for Lightning Components:
Summary:
The Lightning Component framework already uses CSP, which is a W3C standard, to control the source of content that can be loaded on a page. This critical update enables stricter Content Security Policy (CSP) to mitigate the risk of cross-site scripting attacks. Stricter CSP is enforced only in sandboxes and Developer Edition orgs.
Hope this helps!
Sorry to interrupt
Uncaught TypeError: Cannot read property 'setParams' of undefined throws at components/c/AccountMap.js:42:15
:(
Activated the critical update and reviewed all of the code. I am able to get to the map indicators and the map will center. When I do the last module, I receive
It looks like this is an error in the AccountMapController line that is added in Step 1 of the "Interact with the Salesforce Mobile App" section.
Once the next one is passed, the previous one will work.
Thanks
See: https://developer.salesforce.com/forums/?id=9060G0000005SWzQAM and https://bugzilla.mozilla.org/show_bug.cgi?id=1449485
Roland and Ola, are you able to click on a pin and view account details for that account? If so, would you please post the code you have for AccountMapController? When I click a pin in Chrome, I get the following error
Uncaught TypeError: Cannot read property 'setParams' of undefined throws at https://curious-raccoon-356623-dev-ed.lightning.force.com/c/components/c/AccountMap.js:38:15
Per the advice of "David Roberts 4" on the post Trailhead Account Geolocation Project error (https://developer.salesforce.com/forums?id=906F0000000ML3JIAW), I updated AccountLocator.cmp to the following: After doing that, I created a Lightning App Page, dragged the new custom component AccountLocator onto the page, activated the page and added it to an app. After doing all of that, I was able to go to navigate to my new Lightning App Page and click on a pin to open an account record.
I wonder if the explanation Nayana K gave as the "Best Answer" for a different question (https://developer.salesforce.com/forums/?id=9060G000000BhBxQAK) also applies here. She said:
When you try to launch the component via app [...], standard events ([...] navigateToSobject, etc) will be undefined. [...] Therefore launch your [component] in LEX via app builder or lightning quickaction or drag to detail page to check how it works.