このようなテキストを入力すると、
aclk ~_~_~_~_~_~_~_~_~_~_
awaddr ==?X=A1==X=A2X=A3==X==?=X=A4X=?
awvalid __~~~~~~~~~~____~~__
awready ____[~~~~]__[~~]____[~~]__
wdata ====?X=D1X=D2X=?X=D3X=?X=D4==X=?
wvalid ____~~~~__~~__~~~~__
wready ____~~~~__~~____~~__
bresp ====00================
bvalid ____~~~~__~~____~~__
bready ~~~~~~~~~~~~~~~~~~1~~
こんなタイミングチャートを生成する javascript ライブラリとエディタを提供します。
aclk ~_~_~_~_~_~_~_~_~_~_
awaddr ==?X=A1==X=A2X=A3==X==?=X=A4X=?
awvalid __~~~~~~~~~~____~~__
awready ____[~~~~]__[~~]____[~~]__
wdata ====?X=D1X=D2X=?X=D3X=?X=D4==X=?
wvalid ____~~~~__~~__~~~~__
wready ____~~~~__~~____~~__
bresp ====00================
bvalid ____~~~~__~~____~~__
bready ~~~~~~~~~~~~~~~~~~1~~
MIT ライセンスの下、以下のアドレスで公開されています。
$ npm install tchart-coffee
var TimingChart = require('tchart-coffee');
var svg = TimingChart.format(source);
<script src="https://cdn.rawgit.com/osamutake/tchart-coffee/v1.1.2/lib/tchart-coffee.min.js"></script>
<script>
var svg = TimingChart.format(source);
</script>
こちらからご利用いただけます。
https://rawgit.com/osamutake/tchart-coffee/master/bin/editor-offline.html
リンク先で議論されている問題のため、[Save as PNG] および [Generate Images for Copy] のボタンが IE では正常に働きません。
代わりに、SVG 画像上で右クリックから [名前を付けて画像を保存] で形式を PNG にすれば保存できます。 同様に、右クリックから [コピー] で画像をクリップボードへ入れられるので、 Word などへ貼り付ける用途ではむしろ IE の方が便利かもしれません。
セキュリティ上の制限のため、javascript からクリップボードへ 自動的にコピーすることはできないようになっています。 そこで、手動で対応していただく必要があります。
まず [Generate Images for Copy] ボタンを押すと SVG ソースと PNG 画像が生成されます。
熊谷正朗さんの "Timing chart formatter by kumagai" を大いに参考にさせていただきました。→ http://www.mech.tohoku-gakuin.ac.jp/rde/contents/library/tchart/indexframe.html
記述文法はほぼ熊谷さんの tchart を踏襲しています。
大変有用なツールをご提供くださったことに感謝いたします。