使用svg绘制波形
打开本目录中index.html在网页底部文本框中写入代码来绘制波形图
推荐使用chrome浏览器打开,chrome37和chrome41测试使用正常
代码关键字说明如下:
不是关键字开头的就为注释;def定义特殊变量;clk定义单信号或时钟,上下沿为垂直线;sig定义单信号或时钟,与clk不同,上下沿为斜线;bus定义多位宽信号;txt显示文本于指定位置(注意单位为px);lin画垂直虚线
命令结构说明:
def 变量名 其值 其它字符注释
clk 显示信号名 重复次数{数值h/l,数值h/l,...可多个逗号分隔} 重复次数{数值h/l,数值h/l,...可多个逗号分隔} ...可多个“重复次数{}”,空格分隔
sig 显示信号名 重复次数{数值h/l,数值h/l,...可多个逗号分隔} 重复次数{数值h/l,数值h/l,...可多个逗号分隔} ...可多个“重复次数{}”,空格分隔
bus 显示信号名 重复次数{数值v/z,数值v/z,...可多个逗号分隔} 重复次数{数值v/z,数值v/z,...可多个逗号分隔} ...可多个“重复次数{}”,空格分隔
txt 显示字符 位置x(px) 位置y(px)
lin 重复次数{开始x位置,开始y位置,结束y位置,重复间隔}
以上有重复次数的地方可以不写数字,则表示只重复一次;lin中没有重复次数时,重复间隔可不写
以上数字位置处没有标(px)的地方单位x方向为preci[0],y方向为preci[1]
以上数值后的h/l或v/z中不是h就默认为l;不是v就是z;即为l或z时可以省略。 但是h/l不能连续使用两次如: clk sign0 2{3h,3h} {2,5l} 2{3h,4l,2h} 这里三个大括号中都有错,最后一个重复后为{3h,4l,2h,3h,4l,2h}导致连续两个都为h
以上命令中def txt lin命令完成后以空格分隔之后的字符不会被解析,即为注释;但是clk sig bus中{}以空格分隔重复多次,所以不支持这样的注释
以上命令和h,l,v,z等不区分大小写
将代码写入网页底部文本框中后按f5或点击‘绘制’后执行绘制
def left_space 150 定义左边空白区域大小(px)用于显示信号名
def top_space 10 定义上边空白区域大小(px)
def spacing 10 定义每行之间的间隔(px)
def preci_x 10 定义x方向变化精度(px),即clk,sig,bus,lin中x方向数字的单位,即preci[0]的值
def preci_y 20 定义y方向变化精度(px),即lin中y方向数字的单位,每行信号高度,即preci[1]的值
以下clk,sig,bus之后不能有注释: 绘制时钟信号,10个时钟周期,先5个单位高电平后5个单位低电平
clk clk 10{5h,5l}
位宽为1的信号,l和h命令不能连续用两个,要间隔交替使用
sig sign1 3{5h,5l} 5{3h,2} {5h} 3{7l,5h}
位宽大于1的信号
bus sign2 2{10v,5z,5z,10v} {5z} 3{3v,5z,3v,1z}
信号名为中文
Bus ad中文测试 {3z,5v,2z,10v,30,20v}
Txt 测试文本 750 125 在指定位置显示文本,这里的坐标单位x,y和其它不同这里单位为px
lin 9{10,1,4,10} 指定垂直虚线
lin {5,1,3,60} 不带重复的垂直虚线