How to apply a skin json #420

Open

Open

How to apply a skin json#420

I'm using wavedrom editor on MacOS with M2 processor.
I already generate a skin json file using svg2js.js, but I don't know how to apply this file into the editor.
I've tried config:{skin:{The generated code}}, but it didn't work.

Author

@drom @itsayellow

Member

I've been away from wavedrom for years, so grain of salt..

but from https://wavedrom.com/tutorial.html , it seems you need a string for the skin property. My guess is you load your skin JS script and then use the name inside the definition (e.g. Waveskin.mySkin would give a skin name "mySkin".).

Member

Online WaveDrom editor comes with predefined set of skins. If you want to add your custom skin you will need to use some environment where you can add JS code. I use Observablehq.com . Look into the last cell here to see how skin can be added: https://observablehq.com/@drom/handshake-annotation?collection=@drom/wavedrom

alaksandarjesus

Below is my code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body onload="WaveDrom.ProcessAll()">
 
    <!-- Download skins from https://github.com/wavedrom/wavedrom/tree/trunk/unpacked -->

    <script src="./skin.narrow.js"></script>
    <script src="./skin.default.js"></script>
    <script src="./wavedrom.js"></script>
    <script type="WaveDrom">
        { signal : [
          { name: "clk",  wave: "p......" },
          { name: "bus",  wave: "x.34.5x",   data: "head body tail" },
          { name: "wire", wave: "0.1..0." },
        ],
            config:{hscale:1, skin:'narrow'}
    }
        </script>

</body>
</html>

to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

Labels

No labels

No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests