Contenuto principale

Questa pagina è stata tradotta con la traduzione automatica. Fai clic qui per vedere l’originale in inglese.

Incorpora un grafico

Incorpora un grafico di un canale pubblico

Utilizza l'API dei grafici come origine di un iframe per incorporare i grafici dei canali pubblici ThingSpeak™ nella tua pagina web.

Codice incorporato del grafico pubblico

<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID"></iframe>
Sostituisci CHANNEL_ID con l'ID del canale e FIELD_ID con l'ID del campo che vuoi rappresentare graficamente. È anche possibile regolare l'altezza e la larghezza del grafico modificando i parametri height e width in iframe. Ad esempio, per avere un grafico di dimensioni 800 x 400 pixel, iframe dovrebbe essere <iframe width="800" height="400" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID"></iframe>.

Esempio di grafico

Incorpora un grafico di un canale privato

Per incorporare un grafico di un canale privato nella tua pagina web, usa l'API del grafico come origine di un iframe e aggiungi il parametro del grafico api_key=XXXXXXXXXXXXX, sostituendo XXXXXXXXXXXXX con la chiave API di lettura del canale. Se si desidera rendere dinamico il grafico, è anche possibile aggiungere il parametro grafico dynamic=true.

Codice incorporato del grafico privato

<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID?api_key=XXXXXXXXXXXXX"></iframe>
Sostituisci CHANNEL_ID con l'ID del canale, FIELD_ID con l'ID del campo che vuoi rappresentare graficamente e XXXXXXXXXXXXX con la chiave API di lettura del canale privato.

Incorpora un grafico dinamico

Per posizionare un grafico dinamico ThingSpeak sulla tua pagina web, usa l'API del grafico come origine di un iframe e aggiungi il parametro del grafico dynamic=true.

Codice incorporato del grafico dinamico

<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID?dynamic=true"></iframe>
Sostituisci CHANNEL_ID con l'ID del canale e FIELD_ID con l'ID del campo che vuoi rappresentare graficamente.

Vedi anche

Argomenti