Display net names on traces and pads

Displaying network names should be a good choice, just like the KiCad or other CAD/EDA tools. I really need this feature. Do you have any plans to add that? The net name should be displayed on three items.

Pad
Via
A line segment

Meanwhile, that should be hidden when the line is too short or the pad is too small.

A possible implementation

🖐 See this implementation here. I can create a pull request if necessary.

I found a feasible implementation that also looks good. I think a good beginning is displaying on the pad.

The pad class, kicad.board.Pad includes a property net and holds type kicad.board.Net. That makes obtaining the network name easy. The via and the line segment only includes net numbers and requires additional operating.

So I think adding net names display on the pad is simple and more feasible.

The basic idea

The class PadPainter renders the pad. The initial idea was to add the drawing into the paint method. But note that the paint method may be called multiple times. The network name only needs to be drawn once. So a better approach should be to add virtual layers, which are only used for rendering.

I added them in the file src/viewers/board/layers.ts.

export enum LayerNames {
    ...
    non_plated_holes = ":NonPlatedHoles",
    // -------
    // The new layers
    pad_net_hole = ":All:Pad:NetName",
    pad_net_front = ":F:Pad:NetName",
    // -------
    via_holes = ":Via:Holes",
    pad_holes = ":Pad:Holes",
    pad_holewalls = ":Pad:HoleWalls",
    ...

An additional case is a through-hole pad, which requires the rendering on both the front and the backside. So it has a separate layer name and can be processed simply when rendering.

After that, I added the layers in the method PadPainter.layers_for.

layers_for(pad: board_items.Pad): string[] {
    // TODO: Port KiCAD's logic over.
    const layers: string[] = [];

    if (pad.type === "thru_hole") {
        // Add the netname
        layers.push(LayerNames.pad_net_hole);
    }

    for (const layer of pad.layers) {
        ...

Then, add the rendering in the paint method.

The pad shape will not be drawn when drawing the net name (i.e. the layer name contains the substring "NetName".

Hidden the net name

Due to the net name being rendered as a virtual layer, we should make sure the visibility is the same as the copper visibility because we don't want these virtual layers to be displayed on the UI.

Therefore, we can ensure that these virtual layers adhere to some rules. For example, all virtual layers with F.Cu in their names follow the visibility of the F.Cu layer. We can found event handlers in the class kicanvas.elements.kc-board.layers-panel.KCBoardLayersPanelElement.

Toggle the visibility

The implementation should hide the net name virtual layers in the event handler which is added by the this.panel_body.addEventListener method. We can know the virtual layer name by the copper layer name.

layer.visible = !layer.visible;
item.layer_visible = layer.visible;

// The special case
if (item.layer_name.includes("Cu")) {
  const net_layer_name = `:${item.layer_name}:Pad:NetName`;

  // the virtual layer visibility should follow the copper layer
  const net_layer = this.viewer.layers.by_name(net_layer_name);
  if (net_layer) {
    net_layer.visible = layer.visible;
  }
}

A special case is the through-hole pad, in which no layers can be followed.

Presents

The present feature is based on the return value from the ui_layers method. We need to concat the ui_layers and the netname_layers because the virtual layers are not displayed.

*display_layers() {
    for (const l of this.in_ui_order()) {
        yield l;
    }

    // Because we do not want the network layer to be displayed in the UI
    // we have added it separately
    for (const l of this.netname_layers()) {
        yield l;
    }
}

The netname_layers method returns all net name virtual layers.

*netname_layers() {
    for (const name of NetLayerNames) {
        const layer = this.by_name(name);
        if (layer) {
            yield layer;
        }
    }
}

Now we can filter the return values.

switch (item.name) {
    ...
    case "front":
        for (const l of ui_layers) {
            l.visible = l.name.startsWith("F.") ||
                            l.name.startsWith(":F") ||
                            l.name.startsWith(":All") ||
                            l.name == LayerNames.edge_cuts;
        }
        break;
    ...

After completing the above modifications, I have implemented this feature.

Known issues

The net name of the through-hole pad will not be hidden, even though all layers are invisible.
Vias will cover the network name of the pad.

theacodes / kicanvas