All Projects → rabix → Cwl Svg

rabix / Cwl Svg

Licence: apache-2.0
A library for generating an interactive SVG visualization of CWL workflows

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Cwl Svg

Rnaseq Workflow
A repository for setting up a RNAseq workflow
Stars: ✭ 170 (+198.25%)
Mutual labels:  bioinformatics, workflow
Arvados
An open source platform for managing and analyzing biomedical big data
Stars: ✭ 274 (+380.7%)
Mutual labels:  bioinformatics, workflow
Cuneiform
Cuneiform distributed programming language
Stars: ✭ 175 (+207.02%)
Mutual labels:  bioinformatics, workflow
Pegasus
Pegasus Workflow Management System - Automate, recover, and debug scientific computations.
Stars: ✭ 110 (+92.98%)
Mutual labels:  bioinformatics, workflow
Galaxy
Data intensive science for everyone.
Stars: ✭ 812 (+1324.56%)
Mutual labels:  bioinformatics, workflow
Ugene
UGENE is free open-source cross-platform bioinformatics software
Stars: ✭ 112 (+96.49%)
Mutual labels:  bioinformatics, workflow
sapporo
A standard implementation conforming to the Global Alliance for Genomics and Health (GA4GH) Workflow Execution Service (WES) API specification and a web application for managing and executing those WES services.
Stars: ✭ 17 (-70.18%)
Mutual labels:  workflow, bioinformatics
bistro
A library to build and execute typed scientific workflows
Stars: ✭ 43 (-24.56%)
Mutual labels:  workflow, bioinformatics
Ngx Graph
Graph visualization library for angular
Stars: ✭ 704 (+1135.09%)
Mutual labels:  svg, workflow
Cromwell
Scientific workflow engine designed for simplicity & scalability. Trivially transition between one off use cases to massive scale production environments
Stars: ✭ 655 (+1049.12%)
Mutual labels:  bioinformatics, workflow
Genomics
A collection of scripts and notes related to genomics and bioinformatics
Stars: ✭ 101 (+77.19%)
Mutual labels:  bioinformatics, workflow
Cookiecutter
DEPRECIATED! Please use nf-core/tools instead
Stars: ✭ 18 (-68.42%)
Mutual labels:  bioinformatics, workflow
Flowr
Robust and efficient workflows using a simple language agnostic approach
Stars: ✭ 73 (+28.07%)
Mutual labels:  bioinformatics, workflow
Sarek
Detect germline or somatic variants from normal or tumour/normal whole-genome or targeted sequencing
Stars: ✭ 124 (+117.54%)
Mutual labels:  bioinformatics, workflow
Wdl
Workflow Description Language - Specification and Implementations
Stars: ✭ 438 (+668.42%)
Mutual labels:  bioinformatics, workflow
Scipipe
Robust, flexible and resource-efficient pipelines using Go and the commandline
Stars: ✭ 826 (+1349.12%)
Mutual labels:  bioinformatics, workflow
Sv Callers
Snakemake-based workflow for detecting structural variants in WGS data
Stars: ✭ 28 (-50.88%)
Mutual labels:  bioinformatics, workflow
Emperor
Emperor a tool for the analysis and visualization of large microbial ecology datasets
Stars: ✭ 51 (-10.53%)
Mutual labels:  bioinformatics
River Admin
🚀 A shiny admin interface for django-river built with DRF, Vue & Vuetify
Stars: ✭ 55 (-3.51%)
Mutual labels:  workflow
Yetiforcecrm
Our team created for you one of the most innovative CRM systems that supports mainly business processes and allows for customization according to your needs. Be ahead of your competition and implement YetiForce!
Stars: ✭ 1,056 (+1752.63%)
Mutual labels:  workflow

CWL-SVG

Build Status

CWL-SVG is a Typescript library for visualization of Common Workflow Language workflows

Citation

CWL-SVG: an open-source workflow visualization library for the 
Common Workflow Language. Seven Bridges/Rabix (2017)  
Available from https://github.com/rabix/cwl-svg

Installation

npm install cwl-svg

Standalone Demo

git clone https://github.com/rabix/cwl-svg
cd cwl-svg
npm install
npm start
// Point browser to http://localhost:8080

Integration

<html>
<head>
    <style>
        #svg {
            width: 100%;
            height: 100%;
            position: absolute;
        }
    </style>
</head>

<body>

<!-- You need to add “cwl-workflow” class to the SVG root for cwl-svg rendering -->
<svg id="svg" class="cwl-workflow"></svg>

<!-- Add compiled scripts, however they get compiled -->
<script src="dist/bundle.js"></script>

</body>
</html>
// Content of src/demo.ts

// Dark theme
import "./assets/styles/themes/rabix-dark/theme";
import "./plugins/port-drag/theme.dark.scss";
import "./plugins/selection/theme.dark.scss";

// Light theme
// import "./assets/styles/theme";
// import "./plugins/port-drag/theme.scss";
// import "./plugins/selection/theme.scss";

import {WorkflowFactory}    from "cwlts/models";
import {Workflow}           from "./graph/workflow";
import {SVGArrangePlugin}   from "./plugins/arrange/arrange";
import {SVGNodeMovePlugin}  from "./plugins/node-move/node-move";
import {SVGPortDragPlugin}  from "./plugins/port-drag/port-drag";
import {SelectionPlugin}    from "./plugins/selection/selection";
import {SVGEdgeHoverPlugin} from "./plugins/edge-hover/edge-hover";
import {ZoomPlugin}         from "./plugins/zoom/zoom";

const sample = require(__dirname + "/../cwl-samples/rna-seq-alignment.json");

const wf = WorkflowFactory.from(sample);

const svgRoot = document.getElementById("svg") as any;

const workflow = new Workflow({
    model: wf,
    svgRoot: svgRoot,
    plugins: [
        new SVGArrangePlugin(),
        new SVGEdgeHoverPlugin(),
        new SVGNodeMovePlugin({
            movementSpeed: 10
        }),
        new SVGPortDragPlugin(),
        new SelectionPlugin(),
        new ZoomPlugin(),
    ]
});

// workflow.getPlugin(SVGArrangePlugin).arrange();
window["wf"] = workflow;

Preview

Overview

Arranged and scaled BCBio workflow

Selection

Selection and Highlighting

Movement

Movement

Connection

Connecting Nodesd

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].