ラジオボタンでフルカラーLEDの色を変える
コンテンツ
今回やること
obnizに繋いだフルカラーLEDの色を、ラジオボタンによって変更します。
用意するもの
- フルカラーLED
- 抵抗 x3
- obniz Board
- モバイルバッテリーなど
- スマートフォン or PC
組み立て方
フルカラーLEDのパーツライブラリを参考に、図のようにLEDをobniz Boardに接続します。
| obniz | LED |
|---|---|
| 0 | 緑 |
| 1 | 青 |
| 2 | 赤 |
| 3 | アノード または カソード |
※フルカラーLEDによって脚の並び順が異なる可能性があるのでご注意ください。
プログラム
10行目 let led = obniz.wired('FullColorLED', {r:2, g:0, b:1, common:3, commonType:'cathode_common'}); の commonType のところは、お手持ちのLEDのタイプによって、 anode_common または cathode_common を記述してください。
以下のようにラジオボタンを作ります。
name属性値はcolorsとして1つしか選択できないようにして、value属性値にそれぞれの色を入れています。
<input type="radio" name="colors" value="red" >red
jQueryでチェックされているボタンのvalue属性値を取得します。
let checkedVal = $('input[name="colors"]:checked').val();
完成したプログラム
うごかす
色を選択して change!! を押すと、フルカラーLEDが選択した色に変わります。 gradation change を選択すると、色がグラデーションで変化し続けます。
