iVis-at-Bilkent/cytoscape.js-autopan-on-drag

Name: cytoscape.js-autopan-on-drag

Owner: iVis-at-Bilkent

Description: A Cytsocape.js extension to automatically pan when nodes are out of canvas bounds

Created: 2016-08-09 12:01:18.0

Updated: 2017-10-31 18:52:15.0

Pushed: 2017-12-19 12:04:49.0

Homepage:

Size: 34

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

cytoscape-autopan-on-drag

Description

A Cytsocape.js extension to automatically pan when nodes are out of canvas bounds distributed under The MIT License.

Dependencies

• Cytoscape.js ^{2.7.0 ||} 3.0.0”

Demo

Click for the demo

Usage instructions

Download the library:

• via npm: npm install cytoscape-autopan-on-drag,
• via bower: bower install cytoscape-autopan-on-drag, or
• via direct download in the repository (probably from a tag).

require() the library as appropriate for your project:

CommonJS:

cytoscape = require('cytoscape');
autopanOnDrag = require('cytoscape-autopan-on-drag');

panOnDrag( cytoscape ); // register extension

AMD:

ire(['cytoscape', 'cytoscape-autopan-on-drag'], function( cytoscape, autopanOnDrag ){
topanOnDrag( cytoscape ); // register extension

Plain HTML/JS has the extension registered for you automatically, because no require() is needed.

Default Options

options = {
enabled: true, // Whether the extension is enabled on register
selector: 'node', // Which elements will be affected by this extension
speed: 1 // Speed of panning when elements exceed canvas bounds

API

instance = cy.autopanOnDrag( options );

An instance has a number of functions available:

ance.enable(); // enable the instance

ance.disable(); // disable the instance

You can also get an existing instance:

utopanOnDrag('get');

Publishing instructions

This project is set up to automatically be published to npm and bower. To publish:

1. Set the version number environment variable: export VERSION=1.2.3
2. Publish: gulp publish
3. If publishing to bower for the first time, you'll need to run bower register cytoscape-autopan-on-drag https://github.com/iVis-at-Bilkent/cytoscape.js-autopan-on-drag.git

Team

• Metin Can Siper, Ugur Dogrusoz of i-Vis at Bilkent University