Total Mileage Calculation

API & Customization Ask Developers
2

Thanks Alejandro,

Now, I am studying your code and modified it a bit to come up with a minimalistic version of it in my Javascript pane (nothing else but this) :

const MY_GOOGLE_API_KEY = 'xxxxxxxxxxxxxx-yyyyyyyyyyyyyyyyyyyy';
const WORKSITE_EDIT = 'scene_145';

var googleMapsLoaded = $.Deferred();

window.googleMapsCallback = function () {
    googleMapsLoaded.resolve();
};

$.extend({
    loadGoogleMaps: function () {
        $.ajax({
            url: "https://maps.googleapis.com/maps/api/js?callback=googleMapsCallback" + '&key=' + MY_GOOGLE_API_KEY,
            dataType: "script"
        }).fail(googleMapsLoaded.reject);
        return googleMapsLoaded.promise();
    }
});

$(document).on('knack-scene-render.' + WORKSITE_EDIT, function (event, scene) {
    $.loadGoogleMaps().done(function () {
        console.log('loadGoogleMaps DONE!');
    });
});

But I always get this annoying error:

"You have included the Google Maps JavaScript API multiple times on this page. This may cause unexpected errors."

I think is has to do with the ajax call.

Anybody have an idea on how to solve this? I searched for hours all over the net and found nothing.