skrypty js - nie zawsze się ładują Opcje

[qbas-s]

czasami mam taki problem, że skrypty JS nie zawsze się ładują. Np mam mapę google która pokazuje trasę z punktu A do pkt B. Czasami jest tak, że po załadowaniu strony wszystko pokaże się bez żadnego zarzutu, czasami mapka się pokaże a trasa nie, innym znowu razem cała mapka się nie załaduje. Próbowałem wczytywać pliki z parametrem async ale wtedy zupełnie nic nie działało. Jak wy rozwiązujecie takie problemy?

Ten post edytował qbas-s 29.05.2014, 22:17:49

[Damonsson]

Możesz najwyżej sprawdzać czy obiekt na którym chcesz działać istnieje. Samo google maps czasami przecież też się gubi, a co dopiero API. Oczywiście to się zdarza bardzo bardzo rzadko. Jeśli u Ciebie często, to coś pewnie popsułeś (IMG:style_emoticons/default/tongue.gif)

Ten post edytował Damonsson 29.05.2014, 16:06:49

[qbas-s]

gdybym coś popsuł to za każdym razem by nie działało (IMG:style_emoticons/default/wink.gif)
Jak sprawdzić to o czym pisałeś? Czyli czy obiekt istnieje? Jeśli nie to jak go załadować?

[trueblue]

W jaki sposób wczytujesz pliki JS?

[qbas-s]

standardowo - poprzez <script

[vermis]

Jakieś błędy w konsoli JS?

[qbas-s]

tak, kiedy skrypt google map nie ładuje się poprawnie wtedy otrzymuje:
Uncaught TypeError: Cannot read property 'setDirections' of undefined

Funkcja w której używam setDirections (ta funkcja ma za zadanie obliczać wyznaczać trasę z punktu a do punktu b, użytkownik może też podać punkty pomiędzy które znajdują się w additional_places):

[JAVASCRIPT] pobierz, plaintext 
function calcRoute() {
    var e = document.getElementById("autocomplete").value;
    var t = document.getElementById("autocomplete_to").value;
    var n = [];
    var r = document.getElementById("additional_places").value;
    var i = r.toString().split(";");
    for (var s = 0; s < i.length; s++) {
        if (i[s] !== "") {
            n.push({location: i[s], stopover: true})
        }
    }
    var o = {origin: e, destination: t, waypoints: n, optimizeWaypoints: false, travelMode: google.maps.TravelMode.DRIVING};
    var u = new google.maps.DirectionsService;
    u.route(o, function(e, t) {
        if (t == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(e);
            var n = e.routes[0];
            var r = document.getElementById("distance");
            var i = document.getElementById("dist_inp");
            r.innerHTML = "";
            var s = 0;
            for (var o = 0; o < n.legs.length; o++) {
                s += parseInt(n.legs[o].distance.value)
            }
            r.innerHTML = s / 1e3;
            i.value = s / 1e3;
            if (trasa != null)
                trasa.setMap(null);
            polylineOptions = {map: map, strokeColor: "#FF0000", strokeOpacity: .7, strokeWeight: 5, path: e.routes[0].overview_path};
            trasa = new google.maps.Polyline(polylineOptions);
            map.fitBounds(e.routes[0].bounds);
        }
    });
}
[JAVASCRIPT] pobierz, plaintext 

Ten post edytował qbas-s 1.06.2014, 16:07:08

[trueblue]

Gdyby GM się nie ładował, to błąd miałbyś już w linii 12.
Gdzie inicjujesz zmienną "directionsDisplay"?

[qbas-s]

mam do tego funkcję

[JAVASCRIPT] pobierz, plaintext 
function initialize() {
    directionsDisplay = new google.maps.DirectionsRenderer;
    var e = {center: new google.maps.LatLng(52.232938, 21.061194), zoom: 12};
    map = new google.maps.Map(document.getElementById("mapcanvas"), e);
    var t = new google.maps.panoramio.PanoramioLayer;
    t.setMap(map);
    autocomplete = new google.maps.places.Autocomplete(document.getElementById("autocomplete"), {types: ["geocode"]});
    autocomplete_to = new google.maps.places.Autocomplete(document.getElementById("autocomplete_to"), {types: ["geocode"]});
    google.maps.event.addListener(autocomplete, "place_changed", function() {
    });
    google.maps.event.addListener(autocomplete_to, "place_changed", function() {
    });
}
[JAVASCRIPT] pobierz, plaintext 

która jest inicjowana zaraz po załadowaniu strony;

[JAVASCRIPT] pobierz, plaintext 
google.maps.event.addDomListener(window, "load", initialize);
[JAVASCRIPT] pobierz, plaintext 

[trueblue]

A calcRoute, w którym momencie jest wywoływana?

[qbas-s]

napisałem sobie funkcje która w razie potrzeby przekazuje do widoku kod js który jest wyświetlany przed </body>. Tak jest w tym przyadku, funkcja calcRoute() jest wyświetlana przed </body> i ma na celu pokazanie trasy którą wcześniej zapisał sobie użytkownik. Trasa jest wyznaczana na podstawie danych zawartych w inputach o id: autocomplete, autocomplete_to i additional_places

[trueblue]

Nie wiem czy dobrze rozumiem, ale jeśli wywołujesz ją bezpośrednio w head nie czekając na jakiekolwiek zdarzenie, to jest ona wywoływana wcześniej niż "initialize".

[qbas-s]

właśnie initialize jest wywoływane w head a wywołaie funkcji calcRoute() tuż przed znacznikiem </body> czyli na końcu dokumentu. Niby powinno działać bez zarzutu. Dodatkowe teraz zauważyłem, że jeśli nie wywołuję w nagłówku jquery.2.0.3.min.js i jquery.1.2.1.migrate.min.js to skrypt google map działa poprawnie za każdym razem

Ten post edytował qbas-s 1.06.2014, 19:08:08

[trueblue]

Nie chodzi to o kolejność w kodzie.
initialize jest wywoływane w onLoad GM, czyli najzwyczajniej w 99,99% przypadkach później niż calcRoute.
Musisz calcRoute wywołać po initialize (np. wewnątrz tejże funkcji).

[qbas-s]

(IMG:style_emoticons/default/biggrin.gif) masz rację, teraz działa za każdym razem, sog dla Ciebie a jak będziesz w Wawie to zapraszam na bro (IMG:style_emoticons/default/wink.gif)