whatisgithub

What is dagre?

dagrejs/dagre — explained in plain English

Analysis updated 2026-06-26

★ 5,641TypeScriptAudience · developerComplexity · 2/5LicenseSetup · easy

In one sentence

A JavaScript library that automatically calculates where to place nodes and how to route arrows in directed graphs, flowcharts, dependency trees, pipelines, entirely in the browser with no server needed.

Mindmap

mindmap
  root((repo))
    What it does
      Node placement
      Arrow routing
      Directed graph layout
    Use cases
      Flowcharts
      Dependency trees
      Pipelines
    Integration
      npm package
      Client-side only
      No server needed
    License
      MIT open source
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Render a software dependency tree as an auto-arranged visual diagram in a web app without manually placing nodes.

USE CASE 2

Build a flowchart editor where users define connections and dagre automatically positions nodes in a readable layout.

USE CASE 3

Visualize CI/CD pipeline steps as a directed graph in a browser-based dashboard.

USE CASE 4

Add automatic graph layout to a React or Vue app using the @dagrejs/dagre npm package.

What is it built with?

TypeScriptJavaScriptnpm

How does it compare?

dagrejs/dagrevas3k/taxhackeryeemachine/kalidokit
Stars5,6415,6405,638
LanguageTypeScriptTypeScriptTypeScript
Setup difficultyeasyeasymoderate
Complexity2/52/53/5
Audiencedeveloperpm founderdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 30min
Use freely for any purpose, including commercial, with no restrictions beyond keeping the copyright notice.

So what is it?

Dagre is a JavaScript library for arranging directed graphs visually in a browser. A directed graph is a diagram where items (nodes) are connected by arrows pointing in a specific direction, like a flowchart or a dependency tree. The library handles the math of figuring out where to place each node and how to route the connecting lines so the result looks organized and readable. You describe what connects to what, and dagre figures out the layout. It runs entirely on the client side, meaning the layout calculation happens in the user's browser without needing a server. It is available as a package on npm under the @dagrejs/dagre name, and that is the version currently receiving active updates. The project is MIT-licensed and open source.

Copy-paste prompts

Prompt 1
Show me how to install @dagrejs/dagre and render a simple directed graph with 5 nodes and edges in a browser using plain JavaScript.
Prompt 2
I'm building a dependency tree visualizer with dagre. How do I define nodes and edges, run the layout, and extract the calculated x and y positions to draw them on a canvas?
Prompt 3
How do I integrate dagre with React Flow or Cytoscape.js to get automatic layout for a flowchart editor?
Prompt 4
Can dagre handle very large graphs with hundreds of nodes? What are the performance trade-offs and how do I configure edge routing for large layouts?
Prompt 5
How do I set the direction of the dagre layout to left-to-right instead of top-to-bottom, and how do I control the spacing between nodes?

Frequently asked questions

What is dagre?

A JavaScript library that automatically calculates where to place nodes and how to route arrows in directed graphs, flowcharts, dependency trees, pipelines, entirely in the browser with no server needed.

What language is dagre written in?

Mainly TypeScript. The stack also includes TypeScript, JavaScript, npm.

What license does dagre use?

Use freely for any purpose, including commercial, with no restrictions beyond keeping the copyright notice.

How hard is dagre to set up?

Setup difficulty is rated easy, with roughly 30min to a first successful run.

Who is dagre for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.

What are similar repos?