• Ola Bamidele
  • NEWBIE
  • 95 Points
  • Member since 2017

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 39
    Questions
  • 83
    Replies
Hi Gurus, 

I have a leaflet map that displays accounts around europe however, is there a way for the map to display only accounts within a certain radius? 

I've been investigating and I have tried to implement the "L.circle([lat,lng], radius).addTo(map);" however I cant get it work as im getting an error saying "Uncaught TypeError: Cannot read property 'lng' of null throws at https://tipeurope--tt.lightning.force.com/resource/leaflet/leaflet.js:5:77837" 

Does anyone know how I can add a radius to the map by any chance?

This is my code, thanks very much! :
({
   jsLoaded:
    function(component, event, helper) {
        // Set initial map parameters
        var map = L.map('map', {zoomControl: true, tap: false})
                  
        //Set default view of the map to TIP HQ Amsterdam
                //map.setView([52.311828,4.939566], 12);
        
        //Set default view to Scott Moore's location
                //map.setView([52.7003,1.3626], 12); 
        
        // Set default view of the map based on the users' location 
                 .locate({setView: true,  maxZoom: 16}); 
        
        function onLocationFound(e) {
    L.marker(e.latlng).addTo(map).bindPopup("You are here.").openPopup();
}

map.on('locationfound', onLocationFound);

map.on('moveend', function() {
    console.log("map was panned!");
    console.log("zoom: " + map.getZoom());    // prints out zoom level
    console.log("center: " + map.getCenter());    // prints out map center
    console.log(map.getBounds());    // throws error
});
         
        //Instantiate the map
        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 popupInfo = [account.name];
            var latLng = [account.ShippingLatitude, account.ShippingLongitude];
            // To display account name and status in the text balloon
            L.marker(latLng, {account: account}).addTo(map)
             .bindPopup(account.Name + "<br />" + 
                        account.AccountStatus__c + "<br />" +
                           account.Segment__c + ", Fleet size= " + account.Customer_Fleet_Size__c);
        }  
    },
    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");
    map.panTo([account.ShippingLatitude, account.ShippingLongitude]);
}
})
Hi gurus, 

I have a Salesforce1 app that displays on a map accounts thats near the person that opens the app. The account locations are pulled using longitude and longtitude which then displays them on the map.

However, now I only want to display the accounts that are near the person that opens the app - like a 5 mile radius - as accounts that 100s miles away do not need to be displayed.

Ive been working on this for a while and havent been able to get it working so please if you know how to do so then please let me know! Thanks very much.

This is my code:
({
   jsLoaded:
    function(component, event, helper) {
        // Set initial map parameters
        var map = L.map('map', {zoomControl: true, tap: false})
                  
        //Set default view of the map to TIP HQ Amsterdam
                //map.setView([52.311828,4.939566], 12);
        
        //Set default view to Scott Moore's location
                //map.setView([52.7003,1.3626], 12); 
        
        // Set default view of the map based on the users' location 
                 .locate({setView: true,  maxZoom: 16}); 
        
        function onLocationFound(e) {
    L.marker(e.latlng).addTo(map).bindPopup("You are here.").openPopup();
}

map.on('locationfound', onLocationFound);

map.on('moveend', function() {
    console.log("map was panned!");
    console.log("zoom: " + map.getZoom());    // prints out zoom level
    console.log("center: " + map.getCenter());    // prints out map center
    console.log(map.getBounds());    // throws error
});
         
        //Instantiate the map
        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 popupInfo = [account.name];
            var latLng = [account.ShippingLatitude, account.ShippingLongitude];
            // To display account name and status in the text balloon
            L.marker(latLng, {account: account}).addTo(map)
             .bindPopup(account.Name + "<br />" + 
                        account.AccountStatus__c + "<br />" +
                       	account.Segment__c + ", Fleet size= " + account.Customer_Fleet_Size__c);
        }  
    },
    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");
    map.panTo([account.ShippingLatitude, account.ShippingLongitude]);
}
})


Thanks very much!
 
Hi Gurus, 

I have build a Geolocation app that displays the location of an Account on a map. However to improe and take it further, I have decided to add a function that displays the "Distance" of the account to the person that is viewing the map. 

After days of research, this is how far I have come but I still cant get it work. So please if anyone knows what i am doing wrong or how to make it work, please let me know!

My Code:
public with sharing class AccountController {
    @AuraEnabled
    public static List<Account> findAll() {
    return [SELECT id, name, Location__Latitude__s, Location__Longitude__s, Industry
            FROM Account
            WHERE Location__Latitude__s != NULL AND Location__Longitude__s != NULL
            LIMIT 50];
    DISTANCE(GEOLOCATION(BillingLatitude , BillingLongitude ),
    Account_Name__r.GeoLocation__Latitude__s , Branch_Assigned__r.GeoLocation__Longitude__s )  , 
    'mi')         
 	} 
    	
						
}

Error Message (which doesnt make much sense):
Expecting ';' but was: ','

Thanks very much!
 
Hi gurus, 

I have created an appp when shows leads on a map however, I want to also add a feature which displays the distance of the lead on the map.

I was told to look into Haversine and ive done so but my understanding on how to write it is not good at the moment as I just began.

So does anyone please know what i need to add to my code to display the distance on the map please?

This is my code:
public with sharing class AccountController {
    @AuraEnabled
    public static List<Account> findAll() {
    return [SELECT id, name, Location__Latitude__s, Location__Longitude__s, Industry
            FROM Account
            WHERE Location__Latitude__s != NULL AND Location__Longitude__s != NULL
            LIMIT 50];
 	}
    
    
}

Please if you know what i need to add then let me kno please!
Thanks! 
Hi everyone, 

I have this code for be able to display leads on a map with the distance away from you. 

However for me, it isnt savibg for some reason that I cant see, can anyone see what i am doing wrong please?

This is my code:
 
public with sharing class LeadVisualiserSSController {
    @AuraEnabled
    public static List<Lead> getLeads() {
        return [
            SELECT Id, Name, Latitude, Longitude
            FROM Lead
            WHERE OwnerId = :UserInfo.getUserId() AND Latitude != NULL AND Longitude != NULL
        ];
    }

    @AuraEnabled
    public static User getUserInfo() {
        return [
            SELECT Id, Name, Base_Location__Latitude__s, Base_Location__Longitude__s
            FROM User
            WHERE Id = :UserInfo.getUserId()
        ];
    }
}

Thanks very much
Hi All, 

I this code that displays locations on a map when you click the account name in the account list at the bottom of the page. 

So I was wondering, is it possible to add a filter to the list? So maybe it can be sorted in alphabetical order or filter the account based on something?

Please if you know how then please let me know please!

This is my code:
({
    jsLoaded: function(component, event, helper) {
        var map = L.map('map', {zoomControl: false, tap: 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)
            // To display account name and status in the text balloon
            .bindPopup(account.Name);
            
          }  
    },
    
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");
        map.panTo([account.Location__Latitude__s, account.Location__Longitude__s]);
        		

    }
})

Thank you very much!
Hi everyone,

I am trying to change the map icon for a particular location (located using Latitude and Longitude) however, the map icon is only easily changable when hard coding the Latitude and Longitude manual into the page i.e.:
L.marker([51.5, -0.09], {icon: greenIcon}).addTo(map);

However, I am pulling the account location from a Latitude and Longitude field in Salesforce via this line:
.bindPopup(account.Name);

How can i how change the icon on the map for the accounts on the map whiles using this method of pulling Latitude and Longitude? Please if anyone know how to do so then please let me know.

Thanks very much!

 
Hi Everyone, 

I have writen a short apex code to be able display a couple of fields from Salesforce however, I now have to write a test class, 

So it would be great if someone could please assist me :)  

This is my short apex code that I have:
public with sharing class AccountController {
    @AuraEnabled
    public static List<Account> findAll() {
    return [SELECT id, name, Location__Latitude__s, Location__Longitude__s, Industry
            FROM Account
            WHERE Location__Latitude__s != NULL AND Location__Longitude__s != NULL
            LIMIT 50];
    }
    
}

 
Hi everyone, 

I have this code to pin point a certain location on a map however, it is very static meaning that I will have to enter all the account locations manually into the code for it to show.

So i was wondering, is there a way to make it more dynamic? So it will automatcially pull the location number from the account location field in Salesforce for each account?

Im really not sure so please if you know how to do it hen let me know please!
Thanks!
        
L.marker([37.7851430, -122.4034050]).addTo(map)
        	.bindPopup('Marriott Marquis')
    		.openPopup();
        
        L.marker([37.7941570, -122.3963110]).addTo(map)
        	.bindPopup('Hyatt')
    		.openPopup();

 
Hi gurus,

I have this aura component which populates fields to a page however, it populates the fields under each other unfortunately.

So is there a way to move the different fields side by side, therefore the related fields will be under the main field? For example, Account 1 will be to the left of account 2, then the related fields to account 1 will be under account 1. 

Please if you know how i can do this, please let me know!
Thanks!

My Code:
<aura:component >
    <aura:registerEvent name="accountSelected" type="c:AccountSelected"/>
	<aura:attribute name="account" type="Account"/>
    <li><a onclick="{!c.accountSelected}">{!v.account.Name}</a></li>
    <div class = "Industry">
        <li><a onclick="{!c.accountSelected}">{!v.account.Industry}</a></li>
    </div>    
</aura:component>

 
Hi Gurus, 

I have writen a very short apex code to be able redirect from one Visualforce page to another however, I now have to write a test class, which i am awful at :D 

So it would be great if someone could please assist me :)  

This is my short apex code for the redirection:
 
public with sharing class CustomerSatisfaction
 { public String currentRecordId {get;set;}

  public CustomerSatisfaction (ApexPages.StandardController controller)
    { this.currentRecordId = ApexPages.CurrentPage().getparameters().get('id');}
  
  public PageReference UK_Flag () {                   
           PageReference pageref = new 
                     PageReference('/apex/CustomerSatisfaction_EN?Id='+currentRecordId); 
                     pageref.setRedirect(true);
                     return pageref;}
 
      public PageReference France_Flag () {                   
           PageReference pageref = new 
                     PageReference('/apex/CustomerSatisfaction_FR?Id='+currentRecordId); 
                     pageref.setRedirect(true);
                     return pageref;}
 
}

If someone know how I could write the test then please let me know! Thanks!!
Hi Gurus, 

I have this input field that save the entry into salesforce. However when the size is enlarged, the text is horribly squashed along the left side of the page.

So I have been trying to move the text to upon the entry box instead of the on the side but i have been unsuccessful. Does anyone know how I can achieve this?

My Code::
<apex:inputfield label="How would you rate the current service you receive from TIP Trailer Services?" value="{! Surveys__c.Service_Experience_Rating__c }" required="true"/> 
    
<apex:inputField label="What could TIP Trailer Services do to improve its services to you?" value="{! Surveys__c.What_could_we_do_to_improve__c }" style="width:100%; height: 70px;"/>

Thanks very much!
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.
 
({
    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]);
    }
})