Public
Edited
Dec 27, 2023
wdWrapper (
{
config: { skin: 'professional', hscale: 1, marks: false, hbounds: [0,13],fit2pane:1},
head: {text: 'Demonstrating the <i>addGapsPhase</i> Feature'},
signal: [
{name: 'SSI0CLK 0', wave: 'lhlhlh<l|>hlhlhl<h>'}, // Lane 0
{}, // Lane 1
{name: 'SSI0CLK 1', wave: 'hlhlhl<h|>lhlhlh<l>'}, // Lane 2
{}, // Lane 3
{name: 'MOSI', wave: '==.=.=.<=|>.=.=.=',
phase: 0.2, addGapsPhase: 1.6,
//wave: '==.=.=.<=|>.=.=.=',
//phase: 0.2,
data:[,'MSB',,,,,'LSB'], node: '.C...........E'}, // Lane 4
{phase: 0.2, node: '.A...........B'}, // Lane 5
{name: 'MISO', wave: '==.=.=.<=|>.=.=.=', data:[,'MSB',,,,,'LSB'],
phase: 0.2, addGapsPhase: 1.6,
node: '.D...........F'}, // Lane 6
{}, // Lane 7
{name: 'SSI0EN0', wave: '10............<1>', phase: 1}, // Lane 8
{}, // Lane 9
{name: 'SSI_OE_N', wave: '10............<1>', phase: 1}, // Lane 10
],
edge:[ 'A<->B 4 - 16 bits', 'C-D','E-F' ],
//gaps: '. . . . . . . S'
}
,1)
wdWrapper( {config: {marks:false},signal: [{name:'Evaluating WaveDrom 24.01'}]}, 0)
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 ;
}
})();
wd = (() => {
let i = 0 ;
wavedrom.waveSkin = window.WaveSkin ;
return (obj) => html`${wavedrom.onml.stringify(wavedrom.renderAny(i, obj, wavedrom.waveSkin))}`
})();
wavedrom = (await require(await FileAttachment("wavedrom@1.unpkg.min.js").url()));
(await require(await FileAttachment("narrow.js").url())).catch ( () => {} );
(await require(await FileAttachment("professional_srf.js").url())).catch ( () => {} );
(await require(await FileAttachment("professional.js").url())).catch ( () => {} );
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.
