FPGA開発タイミング図の作成

最初はタイミング図を描くために visio を使っていましたが、その線幅が統一しにくく、見た目が良くないため、waveform 構文を学び、コードを使ってタイミング図を描くことにしました。

開始#

Vscode に waveform render をインストールするか、GitHub で wavedrom を検索してインストールしてください。Vscode は私がよく使うエディタなので、Vscode にプラグインをインストールする方法で waveform の使い方を学ぶことにしました。
Vscode で json ファイルを作成し、内容は以下の通りです。

{

    "signal":[

        {"name":"clk","wave":"p....."},

        {"name":"data","wave":"010101"}

    ]

}

コマンドパネルで以下のコマンドを選択すると、レンダリング結果を確認できます：
|460

構文#

クロック信号#

p は上昇エッジが始まる方形波を表します
n は下降エッジが始まる方形波を表します
l は低電平を表します
h は高電平を表します
大文字は方形波のエッジに矢印を描画します

コードレンダリングによって生成されたタイミング図は次の通りです：

データ信号#

0 と 1
x は不明な状態を表します
= は有効データを表し、2~9 と書くこともでき、異なる色で表示され、data 変数にテキストラベルを追加できます
| を使って信号の一部を省略できます

period と phase 変数はタイミングを調整するために使用されます
period の値は数字 n で、横方向に等比例で拡大または縮小します
phase の値は数字 n で、横方向の位置調整を表し、単位は 1 クロック周期です：
- 正の数の場合、左に n クロック周期移動します
- 負の数の場合、右に n クロック周期移動します
  
  複数の信号は ['group name', {...}, {...}, ...] 構文を使ってグループ化でき、ネストもサポートされています。
  タイミング図の描画が完了した後、画像に装飾を加えることもできます。 "config": { "hscale": n } は画像を横方向に n 倍に拡大します。"head":{ } と "foot":{ } はそれぞれタイミング図の上部と下部に内容を追加します：
text 変数は文字列を設定し、一行のテキストを追加します
tick 変数は整数を設定し、クロック周期の起点にシーケンス番号を表示します（n から開始）
tock 変数は整数を設定し、クロック周期の中点にシーケンス番号を表示します（n から開始）