Main Content

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 ThingSpeak™ pubblici 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 desideri rappresentare nel grafico. È inoltre 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, utilizza l'API del grafico come origine di un iframe e aggiungi il parametro del grafico api_key=XXXXXXXXXXXXX, sostituendo XXXXXXXXXXXXX con la chiave API letta del canale. Se vuoi rendere dinamico il grafico, puoi anche aggiungere il parametro del grafico dynamic=true.

Codice incorporato del grafico incorporato

<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 desideri rappresentare nel grafico e XXXXXXXXXXXXX con l'ID leggere la chiave API del canale privato.

Incorpora un grafico dinamico

Per posizionare un grafico ThingSpeak dinamico sulla tua pagina web, utilizza l'API dei grafici 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 desideri rappresentare nel grafico.

Argomenti complementari