ptomsich / bitfield

:cake: bit field diagram renderer

Install

npm i bit-field

Library usage

var render = require('bit-field/lib/render');
var onml = require('onml');

var reg = [
  {bits: 8, name: 'data'}
];

var options = {
  hspace: 888
};

var jsonml = render(reg, options);
var html = onml.stringify(jsonml);
// <svg...>

CLI Usage

npx bit-field [options] > alpha.svg

options

Options:
  --version     Show version number                                    [boolean]
  --input, -i   path to the source                                    [required]
  --vspace      vertical space                            [number] [default: 80]
  --hspace      horizontal space                         [number] [default: 640]
  --lanes       rectangle lanes                            [number] [default: 2]
  --bits        overall bitwidth                          [number] [default: 32]
  --fontsize    font size                                 [number] [default: 14]
  --fontfamily  font family                              [default: "sans-serif"]
  --fontweight  font weight                                  [default: "normal"]
  --compact     compact format                        [boolean] [default: false]
  --hflip       horizontal flip                       [boolean] [default: false]
  --vflip       vertical flip                         [boolean] [default: false]
  --help        Show help                                              [boolean]

alpha.json

[
    { "name": "IPO",   "bits": 8, "attr": "RO" },
    {                  "bits": 7 },
    { "name": "BRK",   "bits": 5, "attr": "RW", "type": 4 },
    { "name": "CPK",   "bits": 1 },
    { "name": "Clear", "bits": 3 },
    { "bits": 8 }
]

alpha.svg

Online Examples

https://observablehq.com/collection/@drom/bitfield