When defaultLoc is True, the directions link is broken

[frankthoeny]

If defaultLoc is False(default), directions links and distances are not displaying. When defaultLoc is True with a defaultLat and defaultLng, the addresses are showing directions links and distances. But there is an issue with the distances links, a JavaScript error.

Uncaught TypeError: Cannot read property 'setMap' of undefined

Shopify Assets My infowindow-description.html

{{#location}}
<div class="loc-name">{{name}}</div>
<div>{{address}}</div>
<div>{{address2}}</div>
<div>{{city}}, {{state}} {{postal}}</div>
<div>{{hours1}}</div>
<div>{{hours2}}</div>
<div>{{hours3}}</div>
<div>{{phone}}</div>
<div>{{contact}}</div>
<div><a href="http://%7B%7Bweb%7D%7D/" target="_blank">{{web}}</a></div>
{{/location}}

My location-list-description.html

{{#location}}
<li data-markerid="{{markerid}}">
<!--//comment <div class="list-label">{{marker}}</div> endcomment//-->
<div class="list-details">
    <div class="list-content">
        <div class="loc-name">{{name}}</div>
        <div class="loc-addr">{{address}}</div> 
        <div class="loc-addr2">{{address2}}</div> 
        <div class="loc-addr3">{{city}}, {{state}} {{postal}}</div> 
        <div class="loc-phone">{{phone}}</div> 
        <div class="loc-contact">{{contact}}</div> 
        <div class="loc-web"><a href="http://%7B%7Bweb%7D%7D/" target="_blank">{{web}}</a></div>
        {{#if distance}}<div class="loc-dist">{{distance}} {{length}}</div>
        <div class="loc-directions"><a href="http://maps.google.com/maps?saddr={{origin}}&daddr={{address}}%20{{address2}}%20{{city}},%20{{state}}%20{{postal}}" target="_blank">Directions</a></div>{{/if}}
    </div>
</div>
</li>
{{/location}}

JSON Processing Code

// Process the location data depending on the data format type
        if (_this.settings.dataType === 'json' || _this.settings.dataType === 'jsonp') {

           // start of custom code for Google Worksheet feed API - Frank Thoeny 
            var dataLocationStr = _this.settings.dataLocation;
            var dataLocationPatt = new RegExp("google.com");
            if(true === dataLocationPatt.test(dataLocationStr)){

               //Process JSON -> GOOGLE Worksheet feed API - Frank Thoeny
               $.each(data.feed.entry, function (k) { 

                 var obj = data.feed.entry[k];
                 var locationData = {};

                 //locationData['id'] = parseInt(k+1);
                 locationData['name'] = obj.gsx$locname.$t.trim();
                 locationData['lat'] = obj.gsx$lat.$t.trim();
                 locationData['lng'] = obj.gsx$lng.$t.trim();
                 locationData['address'] = obj.gsx$address.$t.trim();
                 locationData['address2'] = obj.gsx$address2.$t.trim();
                 locationData['city'] = obj.gsx$city.$t.trim();
                 locationData['country'] = obj.gsx$city.$t.trim();
                 locationData['hours1'] = obj.gsx$hours1.$t.trim();
                 locationData['hours2'] = obj.gsx$hours2.$t.trim();
                 locationData['hours3'] = obj.gsx$hours3.$t.trim();
                 locationData['phone'] = obj.gsx$phone.$t.trim();
                 locationData['postal'] = obj.gsx$postal.$t.trim();
                 locationData['state'] = obj.gsx$state.$t.trim();
                 locationData['web'] = obj.gsx$web.$t.trim();

                 _this.locationsSetup(locationData, orig_lat, orig_lng, firstRun, origin, maxDistance);

                 i++;

              });

            }

[bjorn2404]

You're using inline directions? Can you post all the settings you're using?

[frankthoeny]

I forgot to mention after entering your Postal(zip code) in the address field and submit, then directions links work fine. The problem is on initial load of the defaultLoc where this issue happens.

[frankthoeny]

Yes, I would like to use Inline directions. Yes or No change the error?

My Settings

$(function() {

  $('#map-container').storeLocator({
    'autoGeocode'       : false,      
    'sessionStorage'    : true,
    'mapID'             : 'map',
    'locationList'      : 'loc-list',
    'formContainer'     : 'form-container',
    'formID'            : 'user-location',
    'addressID'         : 'address',
    'regionID'          : 'region',
    'querystringParams' : true,
    'dataType'          : 'json',    
    'dataLocation'      : "//spreadsheets.google.com/feeds/list/xxxxx/od6/public/values?&alt=json",       
    'defaultLoc'        : true,
    'defaultLat'        : 33.987701,
    'defaultLng'        : -118.4602367,
  'slideMap'          : false,
    'fullMapStart'      : true,      
    'mapSettings'       : {
        'zoom'              : 5,
        'mapTypeId'         : google.maps.MapTypeId.ROADMAP 
    },
    'storeLimit'        : 300,
    'distanceAlert'     : 2500,
    'maxDistanceID'     : 'maxdistance',
    'maxDistance'       : true,
    'loading'           : true,
    'loadingContainer'  : 'loading',
    'listColor1'        : 'fff',
    'listColor2'        : 'fff',       
    'inlineDirections'  : true, 
'infowindowTemplatePath': "{{ 'infowindow-description.html' | asset_url }}",
    'listTemplatePath': "{{ 'location-list-description.html' | asset_url }}",
    'KMLinfowindowTemplatePath': "{{ 'kml-infowindow-description.html' | asset_url }}",
    'KMLlistTemplatePath': "{{ 'kml-location-list-description.html' | asset_url }}"

 });
});

[bjorn2404]

If you do a console.log on the origin, orig_lat and orig_lng before _this.locationsSetup are they all set? Do the distances show up in the location list?

[bjorn2404]

@frank909 Ran into the same error on a project I'm working on. I'm pretty sure I've tracked down the bug. If you can confirm this is working on your end that would be great. Update the clearMarkers method around line 1260 so that the loop uses the limit from the settings:

for (var i = 0; i < this.settings.storeLimit; i++) {

[bjorn2404]

Fixed in v2.2.2 - see updated clearMarkers method.