wdWrapper(
{
head: { text: "Demonstration of Single-Character Visible Node Labels",},
config: { skin: 'default', hscale: 1, marks: false, hbounds: [0,12], fit2pane: true},
signal: [
{ node: '.A<.B>..<.C>....D<.E>'.toLowerCase()},
{name: 'EN', wave: '10....<|>.....1.'},
{ node: '....<.>....<.>..<..>'},
{name: 'SCK', wave: '1.<.0>.<1>.<0|.><1>.<0>.1.<.>.',
node: '....<F>.<J>..<.G>.K'.toLowerCase()},
{ node: '..<.Q>.<.>T<.>.<.X><.>R<.>..'.toLowerCase()},
{name: 'MOSI', wave: 'z<.=>..<.=..|.><.=>...<.>z.',
node: '....<.N....><.P><...>...'.toLowerCase()},
{ node: '.<HY><....><IZ.>..<..><...>.<.SL>'.toLowerCase()},
{name: 'MISO', wave: 'z<.=....><.=..|.><.=..>...z.',
node: '.<.M>..<.O....><.U..>...V'.toLowerCase()},
],
edge:[
'a-h','b-q','c-j','d-k','e-s', 'l-v',
'f-i','g-r','t-n', 'x-p', 'y-m', 'z-o',
'b<->c T',
'a<->b t<sub>ES</sub>',
'd<->e t<sub>SE</sub>',
'h>3<y t<sub>ED</sub>',
'i>3<z t<sub>SD</sub>',
's>7<l t<sub>EDZ</sub>',
'r<->x t<sub>SET</sub>',
'q<->t t<sub>HOL</sub>'
],
}
, 2)
wdWrapper(
{
head: { text: "Demonstration of Single-Character Invisible Node Labels",},
config: { skin: 'professional', hscale: 1, marks: false, hbounds: [0,12], fit2pane: true},
signal: [
{ node: '.A<.B>..<.C>....D<.E>'},
{name: 'EN', wave: '10....<|>.....1.'},
{ node: '....<.>....<.>..<..>'},
{name: 'SCK', wave: '1.<.0>.<1>.<0|.><1>.<0>.1.<.>.',
node: '....<F>.<J>..<.G>.K'},
{ node: '..<.Q>.<.>T<.>.<.X><.>R<.>..'},
{name: 'MOSI', wave: 'z<.=>..<.=..|.><.=>...<.>z.',
node: '....<.N....><.P><...>...'},
{ node: '.<HY><....><IZ.>..<..><...>.<.SL>'},
{name: 'MISO', wave: 'z<.=....><.=..|.><.=..>...z.',
node: '.<.M>..<.O....><.U..>...V'},
],
edge:[
'A-H','B-Q','C-J','D-K','E-S', 'L-V',
'F-I','G-R','T-N', 'X-P', 'Y-M', 'Z-O',
'B<->C T',
'A<->B t<sub>ES</sub>',
'D<->E t<sub>SE</sub>',
'H><Y t<sub>ED</sub>',
'I><Z t<sub>SD</sub>',
'S>7<L t<sub>EDZ</sub>',
'R<->X t<sub>SET</sub>',
'Q<->T t<sub>HOL</sub>'
],
}
, 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 = (() => {
wavedrom.waveSkin = window.WaveSkin ;
return (obj,i) => 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("professional.js").url())).catch ( () => {} );
(await require(await FileAttachment("default.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.
