このページは機械翻訳を使用して翻訳されました。ここをクリックして、元の英語を参照してください。
チャートの組み込み
公開チャネルのチャートの組み込み
チャート API をiframe
のソースとして使用して、公開ThingSpeak™チャネルチャートを Web ページに埋め込みます。
公開チャートの組み込みコード
<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID"></iframe>
CHANNEL_ID
をチャネルの ID に置き換え、 FIELD_ID
をグラフ化するフィールドの ID に置き換えます。height
およびiframe
width
パラメーターを調整することで、チャートの高さと幅を調整することもできます。たとえば、サイズ 800 x 400 ピクセルのグラフを作成するには、 iframe
を<iframe width="800" height="400" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID"></iframe>
にする必要があります。チャートの例
プライベート チャネルのチャートの組み込み
Web ページにプライベートチャネルのグラフを埋め込むには、グラフ API をiframe
のソースとして使用し、 を置き換えてグラフパラメーターapi_key=XXXXXXXXXXXXX
を追加します。 $XXXXXXXXXXXXX
をチャネルの読み取り API キーに置き換えます。チャートを動的にしたい場合は、チャートパラメーターdynamic=true
を追加することもできます。
プライベート チャートの組み込みコード
<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID?api_key=XXXXXXXXXXXXX"></iframe>
CHANNEL_ID
をチャネルの ID に置き換え、 FIELD_ID
をグラフ化するフィールドの ID に置き換え、 XXXXXXXXXXXXX
をプライベートチャネルのAPIキーを読み取ります。動的チャートの組み込み
Web ページに動的なThingSpeakグラフを配置するには、 iframe
のソースとしてグラフ API を使用し、グラフパラメーターdynamic=true
を追加します。 $。
動的チャートの埋め込みコード
<iframe width="450" height="250" style="border: 1px solid #cccccc;" src="https://thingspeak.com/channels/CHANNEL_ID/charts/FIELD_ID?dynamic=true"></iframe>
CHANNEL_ID
をチャネルの ID に置き換え、 FIELD_ID
をグラフ化するフィールドの ID に置き換えます。