Skip to content

Simple editor for creating graphs implemented purely in Elm.

Notifications You must be signed in to change notification settings

jhrcek/graph-editor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

62 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Elm graph editor

Simple editor for creating graphs implemented purely in Elm. See it in action!

Current features

  • The editor has 3 modes, which determine what user interactions are doing with the graph
    • In Create/Edit mode you can
      • Create new nodes by clicking on the canvas (double click to immediately start editing node text).
      • Edit node text by double clicking node. Enter confirms the edit.
      • Create new edges by click & holding mouse button on initial node and dropping on target node.
      • Edit edge text by double clicking edges. Enter confirms the edit.
    • In Layout mode you can
      • move nodes on the canvas using drag and drop.
      • reattach edges to different nodes by dragging node arrowheads
      • get nodes arranged automatically using one of the supported GraphViz's layout engines
      • bring nodes closer/further from each other in their current arrangement
    • In Delete mode you can remove nodes and edges by clicking them.
  • Help button that shows/hides info about how users can create/edit graphs
  • Export graph in different formats

Upcoming Features

  • Ability to save / load multiple graphs in local storage

TODOs

  • Add mode dependent SVG cursors to make semantics of mouse actions clearer

Start development server server

You can start the app in development mode using elm-live command:

``bash elm-live --open --dir=dist -- src/Main.elm --output=dist/js/app.js

About

Simple editor for creating graphs implemented purely in Elm.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published