Passa ai contenuti principali

caricare in cloudinary e vedere in umap



Questo post è la continuazione del post che carica da app a spreadsheet, solo che carica anche immagini sfruttando cloudinary come deposito. Kodular ha un blocco che fa al caso mio ed è non solo quasi uguale a appybuilder, ma fra poco appybuilder sarà dismesso e passerà tutto a kodular. Tanto vale abituarsi.

iscriversi a cloudinary e annotarsi chiavi e nome della cloud

nella zona progetto inserire i dati di prima (nome della cloud e chiavi che ha dato cloudinary) e seguire il metodo del vecchio post per lo spreadsheet:

il programma è il seguente (riciclo quello che segnala le buche nell'asfalto):


Un bottone fa partire la macchina fotografica e dopo che ha scattato la foto piglia il file e lo invia in cloudinary; cloudinary risponde con un URL dell'immagine.
Ci mette un po'. Per cui l'altro bottone va tenuto disabilitato.
L'altro bottone carica nello spreadsheet connesso alla umap col metodo Taifun visto nell'altro post, mettendo l'url dell'immagine in cloudinary nella colonna (creata al momento della preparazione del modulo) che avevo chiamato  nota

NB: la colonna tipo buca , forse per lo spazio fra le parole "tipo" e "buca" fa imballare umap....

Il resto serve a caricare latitudine e longitudine più quello che uno scrive nella casella di testo e lo mette nella colonna Nome (esempio), sempre col metodo Taifun, mentre la umap viene associata allo Spreadsheet così compilato con il metodo del vecchio post.

file .aia svuotato delle chiavi e del nome del mio spreadsheet, che può essere usato come modello importandolo in Kodular:
https://drive.google.com/file/d/1S24SoyU6AuX97ytYCgCf7wz6rfaBRrga/view?usp=sharing




http://umap.openstreetmap.fr/it/map/buche_389635#12/45.4312/9.5842


Miglioramenti - todo, dopo esperimento in auto.
1. la mappa va centrata sulla posizione corrente, non fissa su Crema
2. segnalazioni sonore di fine caricamento sia in Cloudinary che in Sheets sarebbero utili
3. le note andrebbero inserite anche a voce, non solo digitando
4. se waze è attivo, la app si resetta dopo la fotografia; c'è una strana competizione per le risorse dell'Honor...


Perchè il WebViewer carichi la mappa posizionandola sulla posizione corrente del telefono occorre comporre l'HomeUrl così (13 è il livello di zoom), con il Join text:



Per fare un suono occorre piazzare un blocco Sound e caricare negli "Asset" un suono, ad esempio beep.


PS: anche l'icona con cui lanciare il programma finito va caricata fra gli asset, e messa fra le proprietà di Screen1.
Una volta caricatolo fra gli asset, va associato al Sound:



e nel programma messo in punti strategici, ad esempio:



Per annotare a voce nella casella di testo serve invece il blocco Speech_Recognizer (nella pagina Designer)



e questi due blocchi nella pagina dei blocchi:


Un bottone che al click lancia lo Speech_recognizer e il blocco che, quando (when) lo Speech_Recognizer ha finito, mette lo scritto nella solita casellina di testo dove si scriveva a mano.

sorgente .aia svuotato delle chiavi.



Commenti

Post popolari in questo blog

UMAP: mappare con fotografie nel popup

Premessa: come esempio non userò alberi perché non ho il tempo di uscire , ma foto di Crema del passato prese da Gruppi facebook.

I dati saranno messi in un Google Sheet:
ogni riga un segnaposto sulla mappa
ogni colonna una proprietà del segnaposto della mappa

per il tutorial di un prof per alunni delle medie, vedere qui:  https://sites.google.com/view/lucascalzullo/tutorial/umap 

Cosa serve modificare nel LAYER della mappa?

1. La cosa che si vuol far apparire quando il mouse passa sopra il segnaposto (in questo caso l'autore )


2. l'elenco delle colonne da importare nel popup , okkio al numero di parentesi graffe: 3 per le foto

3. i collegamenti allo Sheet (col formato) dove andare a prendere i dati per piazzare i segnaposto.

Il foglio del GoogleSheet sarà composto da tante righe quanti i segnaposti che si vogliono piazzare e le colonne saranno corrispondenti a quelli indicati al passo 2 sopra:



non usare l'URL facebook per le foto di facebook, ma caricarle su un proprio ho…

Utili tutorial in Rete

da Ciro Spataro
Tutorial per creare mappe online su UMAP aggiornabili con file CSV da GOOGLEDRIVE https://cirospat.readthedocs.io/it/latest/tutorial-googledrive-to-umap.html?highlight=umap


<<Ma posso fare una query e scegliere quali colonne avere, usando un linguaggio SQL.
La struttura di una query è questa: SELECTB,C,D,E,G,I,J>> Questi ultimi due URL però contengono (nella query) caratteri strani ed è meglio codificarli, specie per farli parlare con app esterne come uMap. E la query diventa: SELECT%20B%2CC%2CD%2CE%2CG%2CI%2CJ%20WHERE%20I%20Contains%20%27.%27 «%20» è il modo corretto di scrivere uno spazio. «%2C» è la virgola. Altre info sui caratteri qui: http://www.w3schools.com/tags/ref_urlencode.asp La documentazione ufficiale qui: https://developers.google.com/chart/interactive/docs/querylanguage La sintassi esatta (dicesi «encoding») può essere ottenuta anche utilizzando questo strumento online http://meyerweb.com/eric/tools/dencoder/ dove inseriamo codice da tenere se…

come importare il JSON file in appybuilder per fare le app

Sito per costruire app: http://gold.appybuilder.com

Chiamata GET come riferimento per osservare il file JSON da processare:
https://www.overpass-api.de/api/interpreter?data=[out:json];node[natural=tree](45.36386820715566,9.692811369895935,45.36502340932776,9.69470500946045);out%20meta;

Per "visualizzarlo", andare qui e copiarlo dentro: https://vanya.jp.net/vtree/

Preparare un Bottone (Button1) e un Web (Web1) nell'interfaccia utente.
Nei blocchi costruire il GET del JSON file così (l'URL è quello indicato prima)
Poi inserire il blocco che gestisce il file che arriva dalla Rete. Per ora predisporre delle Label per capire come funziona la logica:


Lat e Lon verranno poi usate per definire (e piazzare) i marker sulla Map1 (da inserire nella interfaccia Utente).



Occorre apprendere il concetto di lista e lista di liste.

Infatti il blocco fondamentale prende un JSON e lo trasforma in una lista di liste  (vedere cosa arriva nella Label3 per capirci, i delimitatori sono le par…