Диаграми

Рисувайте блок-схеми и организационни схеми като SVG. Кутиите се поставят автоматично по нива според връзките им или на позициите, които зададете.

Защо помага

• Автоматично разположение
• Блок-схеми и организационни схеми
• Позиции автоматични или ръчни

Къде пасва

• Процеси
• Организационни схеми
• Работни потоци

Пример

<Diagram Label="Company structure" Direction="DiagramDirection.TopDown" NodeWidth="150" Nodes="_nodes" Edges="_edges" />

@code {
    private readonly DiagramNode[] _nodes =
    [
        new("ceo", "Chief Executive Officer", Accent: 0),
        new("cto", "Technology", Accent: 1),
        new("cfo", "Finance", Accent: 2),
        new("coo", "Operations", Accent: 3),
        new("dev", "Development"),
        new("qa", "Quality"),
        new("acc", "Accounting"),
        new("log", "Logistics"),
        new("sup", "Support")
    ];

    private readonly DiagramEdge[] _edges =
    [
        new("ceo", "cto"), new("ceo", "cfo"), new("ceo", "coo"),
        new("cto", "dev"), new("cto", "qa"),
        new("cfo", "acc"),
        new("coo", "log"), new("coo", "sup")
    ];
}

Кратък фрагмент. Добавете @using RayCraft.Blazor.Components към страницата си и ползвайте интерактивен режим на рендиране.

Част от RayCraft Complete.

Всички контроли · Документация