Public
Edited
Dec 30, 2023
wdWrapper(
{
head: {text: " Demonstrating Horizontal Arcs with Flexible Label Positioning - '+' [0-8]? '+' "},
config: { skin: 'professional', wrapSvgInImg: 0, marks: true, fit2pane: true },
signal: [
{},
{ name: 'clk', wave: '01010101010101', node: '.ABCDEFGHIJKL' },
{ node: '............\xc0'},
{ node: '...........\xc1'},
{ node: '..........\xc2'},
{ node: '.........\xc3'},
{ node: '........\xc4'},
{ node: '.......\xc5'},
{ node: '......\xc6'},
{ node: '.....\xc7'},
{ node: '....\xc8'},
{ node: '...\xc9'},
{ node: '..\xca'},
{ node: '.\xcb'},
{ name: 'data', wave: '==============', node: '..NOPQRSTUVWXY' },
{},
],
edge:[
'\xcb++N t<sub>DEF</sub>',
'\xca+0+O t<sub>P0</sub>',
'\xc9+1+P t<sub>P1</sub>',
'\xc8+2+Q t<sub>P2</sub>',
'\xc7+3+R t<sub>P3</sub>',
'\xc6+4+S t<sub>P4</sub>',
'\xc5+5+T t<sub>P5</sub>',
'\xc4+6+U t<sub>P6</sub>',
'\xc3+7+V t<sub>P7</sub>',
'\xc2+8+W t<sub>P8</sub>',
'\xc1+9+X t<sub>ILGL1</sub>',
'\xc0+0<Y t<sub>ILGL2</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 ( () => {} );
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.
