mermaid-js/mermaid · error · Error

Unknown layout algorithm: ${data4Layout.layoutAlgorithm}

Error message

Unknown layout algorithm: ${data4Layout.layoutAlgorithm}

What it means

Thrown by render() when data4Layout.layoutAlgorithm is not a key in the layoutAlgorithms registry. The registry is populated by registerLayoutLoaders / registerDefaultLayoutLoaders (dagre, swimlane, and cose-bilkent only when includeLargeFeatures is on). This fires before any loader runs, so it's purely a name-mismatch against registered algorithms.

Source

Thrown at packages/mermaid/src/rendering-util/render.ts:64

      name: 'swimlane',
      loader: async () => await import('./layout-algorithms/swimlanes/index.js'),
    },
    ...(injected.includeLargeFeatures
      ? [
          {
            name: 'cose-bilkent',
            loader: async () => await import('./layout-algorithms/cose-bilkent/index.js'),
          },
        ]
      : []),
  ]);
};

registerDefaultLayoutLoaders();

export const render = async (data4Layout: LayoutData, svg: SVG) => {
  if (!(data4Layout.layoutAlgorithm in layoutAlgorithms)) {
    throw new Error(`Unknown layout algorithm: ${data4Layout.layoutAlgorithm}`);
  }

  // Prefix all node domIds with the diagram's SVG element ID to ensure uniqueness
  // across multiple diagrams on the same page.
  if (data4Layout.diagramId) {
    for (const node of data4Layout.nodes) {
      const originalDomId = node.domId || node.id;
      node.domId = `${data4Layout.diagramId}-${originalDomId}`;
    }
  }

  const layoutDefinition = layoutAlgorithms[data4Layout.layoutAlgorithm];
  const layoutRenderer = await layoutDefinition.loader();

  const { theme, themeVariables } = data4Layout.config;
  const { useGradient, gradientStart, gradientStop } = themeVariables;

  const svgId = svg.attr('id');

View on GitHub (pinned to d93e9c88c0)

Solutions

1. Use one of the registered algorithm names: 'dagre' (default), 'swimlane', or 'cose-bilkent' (full build only).
2. If you need cose-bilkent, ensure your bundle includes large features (use the standard mermaid build, not the tiny one).
3. Register a custom loader with registerLayoutLoaders([{ name, loader }]) before rendering if you reference a custom algorithm.
4. Pre-validate with getRegisteredLayoutAlgorithm(layoutAlgorithm) which falls back to dagre instead of throwing.

Example fix

// before (tiny build, large features excluded)
{ ..., layoutAlgorithm: 'cose-bilkent' }
// after
{ ..., layoutAlgorithm: 'dagre' } // or use the full mermaid build

const KNOWN_ALGOS = new Set(['dagre', 'swimlane', 'cose-bilkent']);
if (!KNOWN_ALGOS.has(layoutAlgorithm)) throw new Error(`unsupported layout algorithm: ${layoutAlgorithm}`);

function isKnownLayoutAlgorithm(a: string): a is 'dagre' | 'swimlane' | 'cose-bilkent' { return a === 'dagre' || a === 'swimlane' || a === 'cose-bilkent'; }

try { render(data, svg); } catch (e) { if (/Unknown layout algorithm/.test(String(e))) { data.layoutAlgorithm = 'dagre'; render(data, svg); } else throw e; }

When it happens

Trigger: A LayoutData with layoutAlgorithm: 'cose-bilkent' when the build excluded large features (the conditional spread at render.ts:49–56 omits it), or a typo like 'coseBilkent'/'dagre-d3', or a custom algorithm name never registered via registerLayoutLoaders.

Common situations: Using the `tiny`/slim build that sets includeLargeFeatures=false and thus drops cose-bilkent, a version where the default algorithm set changed, or an integration that sets layoutAlgorithm from config without validating against available loaders.

Related errors

• Both layout algorithms ${algorithm} and ${fallback} are not
• Icon set not found: ${data.prefix}
• Configuration is required in layout data
• No nodes found in layout data
• No nodes available to create tree

AI-assisted analysis of mermaid-js/mermaid@d93e9c88c0 (2026-08-12). Data as JSON: /api/errors/73b7ca8d94ef8af6. Report an issue: GitHub.