このウェブアプリケーションは、ロータリーエンコーダの動作原理と仕組みを視覚的に理解するためのインタラクティブなシミュレーターです。
- ノブを回転させることでロータリーエンコーダの動きをシミュレーション
- A相とB相の信号出力の視覚化
- 回転方向の検出と表示
- カウント値の更新と表示
- マウスとタッチ操作の両方に対応
ロータリーエンコーダは、回転運動を電気信号に変換するセンサーデバイスです。一般的なロータリーエンコーダは以下のコンポーネントで構成されています:
- 回転ディスク:透明/不透明のパターンが交互に並んだ円盤
- 光センサー:A相とB相の2つのセンサーが90度の位相差で配置されている
このシミュレーターでは、以下の原理を示しています:
- A相とB相の信号が交互にON/OFFするパターン
- 信号の順序から回転方向を検出する方法(A相の立ち上がり時にB相がONなら反時計回り、OFFなら時計回り)
- エッジ検出によるカウント値の増減
- ウェブブラウザでindex.htmlを開きます
- 円形のコントロールノブをドラッグして回転させます
- A相とB相の信号変化、回転方向、カウント値の変化を観察します
- HTML5, CSS3, JavaScript (ES6+)を使用
- 外部ライブラリに依存しない純粋なバニラJavaScript実装
- レスポンシブデザイン対応
- マウス操作とタッチスクリーン操作に対応