Insert cell
Insert cell
wdWrapper (
{
config: {skin:'professional',fit2pane: 1, hbounds: [0,12.5],
customStyle:
'.blueVoltageLine{stroke:#0000ff;stroke-width:0.3px;stroke-dasharray:2}' +
'.vAnnoStyle{font-size:8px;text-align:center;opacity:0.7;text-anchor:start}'
},
head: {text: 'Arbitrary Text Labels using the <i>tl</i> Feature'},
signal: [
{},
['Counter',
{ wave: ['tl', {coords: [0,0.5], text: 'Lower 8 bits of the 16-Bit MCount', tlStyle: 'text-anchor:start;' } ] },
{ name: 'MCount', wave: '2222222222222', data: ['FE', 'FF', '00', '01', '02', '03', '04', '05', '06', '07', '08', '09', '0A'] }
],
{},
{name: 'UART Example', 'wave': '104.......1u', 'data': ['data'], id: 'uart'},
{},
{name: 'CLK1', wave: '0101010101010101', id: 'clk1'},
{},
{name: 'CLK2', wave: '0101010101010101', node:'..M', id: 'clk2'},
{},
{wave: '<z>', phase: -8.5, skinStyle: 'stroke-dasharray:1,3', id: 'annoz'},
{},
{wave: '0101010101010101', phase:-.4, skinStyle: 'stroke-dasharray:1,3', overlayOnLane: 'clk2'},
{wave: ['pw', { d: ['m',0,0.2, 'L',18,0.2, 'M',0,0.8, 'L',18,0.8], pwClass: 'blueVoltageLine', }, ], overlayOnLane: 'clk1' },
{wave: ['tl', { coords: [0,0.2], text: 'V<sub>IL</sub>', tlClass: 'vAnnoStyle' } ], overlayOnLane: 'clk1' },
{wave: ['tl', { coords: [0,0.8], text: 'V<sub>IH</sub>', tlClass: 'vAnnoStyle' } ], overlayOnLane: 'clk1' },
{wave: ['pw', { d: ['m',0,-0.1, 'L',18,-0.1], pwClass: 'blueVoltageLine', pwStyle: 'stroke:black' }, ], overlayOnLane: 'clk2' },
{wave: ['pw', { d: ['M',0,1.1, 'L',18,1.1], pwClass: 'blueVoltageLine', pwStyle: 'stroke:red' }, ], overlayOnLane: 'clk2' },
{wave: ['tl', { coords: [0,-0.43], text: 'V<sub>SS</sub>', tlClass: 'vAnnoStyle' } ], overlayOnLane: 'clk2' },
{wave: ['tl', { coords: [0,1.43], text: 'V<sub>DD</sub>', tlClass: 'vAnnoStyle' } ], overlayOnLane: 'clk2' },
{overlayOnLane: 'uart', wave: [
'tl', { coords: [1.65,.5], text: 'Start'},
'tl', { coords: [10.65,.5], text: 'ACK'},
]},
{wave: ['tl', { coords: [13,0.5], avoidBBox: true,
text: 'Clock with added internal delay', tlStyle: 'font-size:10;text-anchor:end' } ], overlayOnLane: 'annoz' },

],
}
,2
)
Insert cell
wdWrapper( {config: {marks:false},signal: [{name:'Evaluating WaveDrom 24.01'}]}, 0)
Insert cell
wdWrapper = (() => {
wavedrom.waveSkin = window.WaveSkin ;
return (obj,i) => {
const actSVG = wavedrom.onml.stringify(wavedrom.renderAny(i, obj, wavedrom.waveSkin));
const parser = new DOMParser();
const actSVGForImg = parser.parseFromString(actSVG,'image/svg+xml').firstChild;
let ser = new XMLSerializer();
let imgt = document.createElement('img');
const svgAsImgString = encodeURIComponent(ser.serializeToString(actSVGForImg));
imgt.src = `data:image/svg+xml;utf8,${svgAsImgString}` ;
imgt.style = 'width:100%;height:100%;' ;
return imgt ;
}
})();
Insert cell
wd = (() => {
let i = 0 ;
wavedrom.waveSkin = window.WaveSkin ;
return (obj) => html`${wavedrom.onml.stringify(wavedrom.renderAny(i, obj, wavedrom.waveSkin))}`
})();
Insert cell
wavedrom = (await require(await FileAttachment("wavedrom@1.unpkg.min.js").url()));
Insert cell
(await require(await FileAttachment("narrow.js").url())).catch ( () => {} );
Insert cell
(await require(await FileAttachment("professional_srf.js").url())).catch ( () => {} );
Insert cell
(await require(await FileAttachment("professional.js").url())).catch ( () => {} );
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more