Diagram layer size issue

[GeertvanHorrik]

My diagram is somehow being cut-off by the layers as shown in the example below:

The diagram size is larger (see the grid and the other nodes at the right. But the links don't fully render and are cut-off by the layer. I think this is caused by using the zoom feature where the nodes are correctly positioned based on the zoom, but the links are not.

The SVG layer is the cause, the html layer is rendering correctly.

I think the root cause is that the zoom function translates (transforms) the layers, but the width / height are set to 100%. I think they should be set to an absolute value to work correctly?

[GeertvanHorrik]

Experimenting a little bit with the zoom factor:

    private string GetLayerStyle(int order)
    {
        var styleBuilder = new StringBuilder();

        styleBuilder.Append(FormattableString.Invariant($"transform: translate({BlazorDiagram.Pan.X}px, {BlazorDiagram.Pan.Y}px) scale({BlazorDiagram.Zoom});"));
        styleBuilder.Append(FormattableString.Invariant($"z-index: {order};"));

        var container = BlazorDiagram.Container;
        if (container is not null)
        {
            styleBuilder.Append(FormattableString.Invariant($"width: {container.Width * (1 / BlazorDiagram.Zoom)}px;"));
            styleBuilder.Append(FormattableString.Invariant($"height: {container.Height * (1 / BlazorDiagram.Zoom)}px;"));
        }

        var style = styleBuilder.ToString();
        return style;
    }

Looks like this fixes the sizing, it's now just the offset that seems incorrect. Will investigate a bit more.

[zHaytam]

Hello, the layers have the overflow property set, so they have to show everything.

Do you have a quick way to reproduce this?

Sorry for the very late reply.

[GeertvanHorrik]

I can't reproduce right now, I did do an upgrade of AntDesign. Maybe it was caused by the (outdated?) styles? I will triple check but closing this issue, thanks for looking into it.