draw2d
repository·master·Indexed 21 days ago
https://github.com/freegroup/draw2dAn HTML5 JavaScript library for creating interactive diagrams, workflows, and visual languages similar to Microsoft Visio. Version 6.7.1 provides tools for visualization and interaction with graphs, including a command stack for undo/redo functionality and support for databinding via pure JavaScript, Rivets.js, BackboneJS, and Watch.JS.
What's inside draw2d
- Draw2D is a modern HTML5 JavaScript library designed for creating Visio-like drawings, diagrams, and workflows. It provides tools for visualization and interaction with diagrams and graphs, making it suitable for building visual languages and interactive tools.
What is the Haruki JSDoc template?
masterHaruki is an experimental JSDoc 3 template designed for publishing processes that require machine-readable formats rather than standard HTML. Instead of generating HTML documentation, Haruki outputs a JSON representation of your API, or optionally an XML representation. This makes it suitable for consumption by other tools or for integration into custom documentation pipelines.Access Draw2D Documentation
masterThe official documentation for Draw2D, including API references and guides, is hosted at: https://freegroup.github.io/draw2d/index.htmlRun jsdoc in development mode
masterTo compile the project and enable hot-reloading for a development workflow, use the
servescript.npm run serveBuild jsdoc for production
masterTo compile and minify the project for production deployment, use the
buildscript.npm run buildBuild Draw2D
masterTo build the project, use a Python 3.9 virtual environment to run the build script:
- Create and activate a Python 3.9 virtual environment.
- Execute
./build.sh.
python3.9 -m venv venv source ./venv/bin/activate ./build.shSetup the jsdoc project
masterTo set up the
jsdocproject environment, install the necessary dependencies using npm.npm installGenerate API documentation in XML format using Haruki
masterTo use the Haruki template, run the
jsdoccommand pointing to the Haruki template directory. You can specify the output format using the-qflag. Using-d consoledirects the output tostdout, allowing you to pipe the results into other tools../jsdoc myscript.js -t templates/haruki -d console -q format=xmlPublish a new version of Draw2D
masterTo release a new version to npm, use the following commands to patch the version and publish:
npm version patchnpm publish
npm version patch npm publishSet up Draw2D for Local Development
masterTo develop Draw2D locally, ensure you are using Node.js version
v14.15.0vianvm. Follow these steps to install dependencies and run the development server with examples:- Switch to the required Node version:
nvm use v14.15.0 - Install dependencies:
npm install - Run the development server:
DIR=/examples yarn dev
nvm use v14.15.0 npm install DIR=/examples yarn dev- Switch to the required Node version:
Lint and fix files in jsdoc
masterTo run linting and automatically fix issues in the codebase, use the
lintscript.npm run lintManage undo/redo with CommandStack
masterThe
draw2d.command.CommandStackmanages the execution, undoing, and redoing ofdraw2d.command.Commandobjects. It maintains an undo stack and a redo stack. When a new command is executed, the redo stack is automatically cleared to maintain a clean history.You can access the current command stack from a canvas instance using
canvas.getCommandStack().const commandStack = canvas.getCommandStack(); // Execute a command commandStack.execute(myCommand); // Undo the last action if (commandStack.canUndo()) { commandStack.undo(); } // Redo an undone action if (commandStack.canRedo()) { commandStack.redo(); }