Wątek przeniesiony 2020-08-04 18:42 z Webmastering przez cerrato.

przerwanie funkcji

0

Witam, robię stronę, która pokazuje położenie pojazdu komunikacji, chcę by było można zmienić linię, którą chcę pokazać, ale nie wiem jak to zrobić bo jak zmieniam to wtedy funkcja ze starym numerem dalej działa, wie ktoś jak to rozwiązać?

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
        integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
        crossorigin="" />
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
        integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="
        crossorigin=""></script>
    <style>
        #mapid {
            height: 720px;
        }
    </style>
    <title>Document</title>
</head>

<body>
    <button type="button">Wybierz linie</button>
    <div id="mapid"></div>
    <script>
        
        
        const mymap = L.map('mapid').setView([54.352024, 18.646639], 12);
        const marker = L.marker([54.352024, 18.646639]).addTo(mymap);
        const attribution =
            '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
        const tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
        const tiles = L.tileLayer(tileUrl, { attribution });
        tiles.addTo(mymap);
        const api_url = "https://ckan2.multimediagdansk.pl/gpsPositions?";





        function chooseLine() {
            const line = prompt('wybierz linie');
           
        async function getISS() {
            const response = await fetch(api_url);
            const vehicles = await response.json();

            const lat = vehicles["Vehicles"][line]["Lat"];
            const lon = vehicles["Vehicles"][line]["Lon"];

            marker.setLatLng([lat, lon]);
            mymap.setView([lat, lon], 12)
        }
        getISS();
        setInterval(getISS, 1000);
        
        }


        const el = document.querySelector("button");
        el.addEventListener("click", chooseLine);
       
     
    </script>
</body>

</html>
2

https://www.w3schools.com/jsref/met_win_clearinterval.asp

0

użyłem tego, jednak dalej jest tak samo:

        function chooseLine() {
            const line = prompt('wybierz linie');
            const start = setInterval(getISS, 1000);
            function myStopFunction() {
                clearInterval(start);
            }
            myStopFunction();

            async function getISS() {
                const response = await fetch(api_url);
                const vehicles = await response.json();

                const lat = vehicles["Vehicles"][line]["Lat"];
                const lon = vehicles["Vehicles"][line]["Lon"];

                marker.setLatLng([lat, lon]);
                mymap.setView([lat, lon], 12)
            }
            getISS();
            // const start = setInterval(getISS, 1000);
            setInterval(getISS, 1000);

        }
2

Ja tam widzę tylko zakomentowane // const start = setInterval(getISS, 1000); a dalej po staremu.

0

a napisałem to

function myStopFunction() {
                clearInterval(start);
            }
            myStopFunction();
1

A masz zdefiniowaną zmienną start?

Poza tym upewnij się, czy to setInterval odpalasz tylko raz.

0

start mam w 3 linii, setInterval odpalam jak zmieniam linię pojazdu i wtedy też kasuję setInterval

1

setInterval masz tu odpalane dwa razy, w linii:
3 z przypisaniem do zmiennej start
21 bez przypisania do zmiennej (zatem niewyłączalne)
20 zakomentowane (więc i tak nie działa, ale nie wiem po co),

clearInterval powinno być przed nowym setInterval, bo inaczej nie kasujesz poprzedniego wywołania cyklicznego, tylko właśnie aktualne. Tylko najpierw sprawdź, czy taka zmienna już istnieje, bo inaczej wyskoczy błąd przy pierwszym wywołaniu.

Nie wiem, po co ładujesz te funkcje w funkcjach, np:

           function myStopFunction() {
                clearInterval(start);
            }
0

właśnie nie wiem jak utworzyć zmienną przed clearInterval nie wywołując wcześniej setInterval

2
mistrzkrisu6 napisał(a):

właśnie nie wiem jak utworzyć zmienną przed clearInterval nie wywołując wcześniej setInterval

przecież to właśnie zrobiłeś, tylko potem wywołałeś setInterval po raz drugi
Używaj "let" zamiast "const" jeśli chcesz przypisać do czegoś wartość po raz drugi.
Możesz użyć setTimeout zamiast setInterval co spowoduje jednokrotne wywołanie funkcji - możesz wywoływać to po każdym uruchomieniu funkcji, ale możesz też na podstawie jakiejś zmiennej NIE wywoływać funkcji kolejny raz i tym samym przerwać cykl bez clearInterval

1
mistrzkrisu6 napisał(a):

właśnie nie wiem jak utworzyć zmienną przed clearInterval nie wywołując wcześniej setInterval

Nie musisz jej wcześniej tworzyć, wystarczy, że sprawdzisz, czy już istnieje:

if (typeof start !== 'undefined') clearInterval(start);
0

to jak wstawie tą linię za

const start = setInterval(getISS, 1000);

to mam, że start is not defined - błąd z kolejnej linii

1

obscurity już ci tłumaczył, żeby nie używać "const".

Poza tym masz tę linię, o której właśnie mówię, wstawić po tej linii, którą mam na myśli.
Rozumiesz?

0 
            const line = prompt('wybierz linie');
            if (typeof start !== 'undefined') clearInterval(start);
            let start = setInterval(getISS, 1000);

            async function getISS()

wywala to: Uncaught ReferenceError: Cannot access 'start' before initialization
at HTMLButtonElement.chooseLine

0

A bo to durne let jest interpretowane w kolejności niezgodnej ze swoją pozycją w kodzie i jeszcze tworzy w takim układzie zmienną-zombie.
Czyli musisz jednak zadeklarować zmienną przed przypisaniem jej wartości.

function getISS() {/*tu twoja funkcja*/}

let start;
let line = prompt('wybierz linie');
if (typeof start !== 'undefined') clearInterval(start);
start = setInterval(getISS, 1000);

Chociaż w takim układzie to możesz równie dobrze zrobić:

function getISS() {/*tu twoja funkcja*/}

let start="s";
let line = prompt('wybierz linie');
if (start !== "s") clearInterval(start);
start = setInterval(getISS, 1000);
0

nie wiem czy o to chodziło - nadal działa jak wcześniej

   function chooseLine() {
            // const line = prompt('wybierz linie');
            // if(typeof start !=='undefined') clearInterval(start);
            // let start = setInterval(getISS, 1000);
           
        async function getISS() {
            const response = await fetch(api_url);
            const vehicles = await response.json();

            const lat = vehicles["Vehicles"][line]["Lat"];
            const lon = vehicles["Vehicles"][line]["Lon"];

            marker.setLatLng([lat, lon]);
            mymap.setView([lat, lon], 12)
        }

        let start;
        const line = prompt('wybierz linie');
        if(typeof start !=='undefined') clearInterval(start);
        start = setInterval(getISS, 1000);
        // getISS();
        // setInterval(getISS, 1000);
        
        }
2

start musisz zadeklarować w scopie wyżej (poza funkcją) jeśli chcesz przechować tam wartość do kolejnego wywołania funkcji

  let start;

  function chooseLine() {
        async function getISS() {
            const response = await fetch(api_url);
            const vehicles = await response.json();

            const lat = vehicles["Vehicles"][line]["Lat"];
            const lon = vehicles["Vehicles"][line]["Lon"];

            marker.setLatLng([lat, lon]);
            mymap.setView([lat, lon], 12)
        }

        const line = prompt('wybierz linie');
        clearInterval(start);
        start = setInterval(getISS, 1000);
  }

nie musisz też sprawdzać czy start jest undefined bo jeśli jest to clearInterval po prostu nic nie zrobi

0

dzięki, jednak dalej jak wpiszę nr 112 to go pokazuje i potem jak biorę wybierz linie i 178 wpisuję to wtedy na mapie przeskakuje położenie 112 i 178 na zmiane a mi chodzi o to by wtedy pokazywało tylko położenie ostatnio wpisanego pojazdu

0

ok, dzięki, właśnie tej linii nie miałem z clearInterval, dzięki wielkie

1 użytkowników online, w tym zalogowanych: 0, gości: 1