portrayal.dev

draw.io & OmniGraffle export

A device becomes the compiled drawing as an image, with an invisible, connectable cell over every port. You get the real faceplate and a cable drawn to a port records source="port-12" rather than a coordinate — so the diagram is still addressable after it leaves here. Import a library with File → Open Library from → Device.

Shape library

Devices you drag onto a blank canvas, drawn at 2 px/mm so a faceplate is legible on its own. Scope lists the vendor’s own groups — the same headings the device menu above uses — plus just this device, plus all of the vendor. A vendor with hundreds of devices is not one library.

modules
whatever goes in the chassis — line cards and supervisors on a modular router, but only supplies, fans and filters on a fixed switch. Hover the checkbox for the breakdown. On a modular vendor these outnumber the chassis many times over.
bays
every slot becomes connectable as well as every port, so you can draw a line to “slot 6” rather than to a port on whatever is in it. Slots sit under the ports, so a port still takes the click.
highlight them
tints those cells blue (ports) and amber (bays) so you can see them. Off by default — invisible over an exact drawing is the whole point.

Rack-ready library

The same devices sized for draw.io’s own rack: 138 × 14.8 per RU. Drop one into a rackCabinet3 and it snaps to a unit.

Rack diagram

Finished .drawio pages: draw.io’s cabinets with devices mounted and numbered — a picture of the rack rather than parts to build one with. One page per vendor and family. Each rack is grown to hold what is in it — four 1U boxes make a 7U rack, not a 42U one that is mostly air — and spills into another at 42U. Rails and U numbers are draw.io’s, not ours.

OmniGraffle stencil

The same devices as an OmniGraffle stencil, each face true to size with an invisible shape named after every port and bay. A line drawn to a port attaches to that port by name, and each port carries its media and speed as key/value data. Faces are drawn as images by your browser. Opens in OmniGraffle 7.16 or later.

Why this shape and not a stencil. An inline stencil is about thirty times smaller and stays vector, but mxStencil renders no text — a faceplate loses every port number and every silkscreen line. It can carry named connection points, which draw.io then discards: it writes exitX/exitY into the edge and never the name. An image plus port cells keeps both the picture and the names.