Meteor.js reactive html5 geolocalizzazione position.coords

Sono un meteor.js nuub, ma ho passato un po 'di tempo a cercare di capirlo.Meteor.js reactive html5 geolocalizzazione position.coords

Sto tentando di aggiornare in modo reattivo l'interfaccia utente in base al callback dell'API di geolocalizzazione HTML5 passato in getCurrentPosition. Tuttavia, l'interfaccia utente non viene aggiornata con il mio codice corrente.

Potete offrire suggerimenti e/o una soluzione? Ecco i dettagli:

Basics: server di meteore è in esecuzione, che serve gli altri dati da/verso Mongo tramite raccolte con successo

Ho una pagina principale (main.html):

<head> 
    <title>Geolocation</title> 
</head> 
<body> 
<div class="container"> 
    <header class="navbar"> 
    <div class="navbar-inner"> 
     <a class="brand" href="/">Geolocation</a> 
    </div> 
    </header> 
    <div id="locationDemo"> 
    {{> location}} 
    </div> 
</div> 
</body>

che fa riferimento un modello (location.js):

<template name="location"> 
    <div> 
    Lat: {{lat}} 
    </div> 
    <div> 
    Lon: {{lon}} 
    </div> 
</template>

che ha questo helper associato (location.js):

_lat = { 
    current: 0, 
    dep: new Deps.Dependency, 
    get: function(){ 
    this.dep.depend(); 

    if(this.current === 0){ 
     getLocation(); 
    } 

    return this.current; 
    }, 
    set: function(value){ 
    this.current = value; 
    this.dep.changed(); 
    Deps.flush(); 
    return this.current; 
    } 
}; 

_lon = { 
    current: 0, 
    dep: new Deps.Dependency, 
    get: function(){ 
    this.dep.depend(); 

    if(this.current === 0){ 
     getLocation(); 
    } 

    return this.current; 
    }, 
    set: function(value){ 
    this.current = value; 
    this.dep.changed(); 
    Deps.flush(); 
    return this.current; 
    } 
}; 

function getLocation(){ 
    if (navigator.geolocation) 
    { 
    navigator.geolocation.getCurrentPosition(showPosition, showError); 
    } 
    else{ 
    console.log("Geolocation is not supported by this browser."); 
    } 
} 

function showPosition(position) 
{ 
    _lat.set(position.coords.latitude); 
    _lon.set(position.coords.longitude); 
} 

function showError(error) { 
    switch(error.code) { 
    case error.PERMISSION_DENIED: 
     console.log("User denied the request for Geolocation."); 
     break; 
    case error.POSITION_UNAVAILABLE: 
     console.log("Location information is unavailable."); 
     break; 
    case error.TIMEOUT: 
     console.log("The request to get user location timed out."); 
     break; 
    case error.UNKNOWN_ERROR: 
     console.log("An unknown error occurred."); 
     break; 
    } 
} 

Template.location.helpers({ 
    lat: _lat.get(), 
    lon: _lon.get() 
});

fonte

2014-07-19 Steve Jackson

Sei aspettavo aggiornare quando 'navigator.geolocation.getCurrentPosition' cambia? Se è così, probabilmente avrai bisogno di un 'Deps.autorun', ma anche allora non sono sicuro che la geolocalizzazione possa essere usata come fonte di dati reattiva. –

Ehi Cristian, sì, pensavo che _lat e _lon potessero essere usati come vem reattivi. Stavo pensando a Deps.autorun, ma non sono sicuro di dove chiamarlo. –

Per quanto ne so, navigator.geolocation non è un'origine dati reattiva. Quindi questo non funzionerà senza un sondaggio esplicito. Un'altra cosa che hai sbagliato è che i tuoi aiutanti non sono funzioni, quindi non possono essere chiamati più volte.

Questo potrebbe funzionare (non testato):

Meteor.setInterval(function() { 
    navigator.geolocation.getCurrentPosition(function(position) { 
     Session.set('lat', position.coords.latitude); 
     Session.set('lon', position.coords.longitude); 
    }); 
}, 5000); 

Template.location.helpers({ 
    lat: function() { return Session.get('lat'); }, 
    lon: function() { return Session.get('lon'); } 
});

fonte

2014-07-19 16:49:53

Grazie ancora Christian. Stavo chiedendo la posizione solo una volta (la frase 'if' nel getter), ma mi piace l'idea del sondaggio. Tuttavia, stavo cercando di rendere _lat.get() la sorgente reattiva, non l'API di geolocalizzazione. La geolocalizzazione funziona, ma non la roba dei Deps. –

Take 2: Christian, avevi completamente ragione! Quello che mi mancava era il binding del Template agli oggetti _lat e _lon - che è stato anche sottolineato da Slava Kim (gruppo di meteora di Google). Funziona completamente ora. –

Per arrivare geolocalizzazione per lavorare in applicazioni Meteor compilati in quanto iOS native apps, avevo bisogno di aggiungere il pacchetto di geolocalizzazione disponibile presso https://atmospherejs.com/mdg/geolocation

fonte

2015-05-08 20:18:33 MastaBaba

Meteor.js reactive html5 geolocalizzazione position.coords

risposta

Problemi correlati