javascript - Event when I assign a cell like source/target on a link? -
i use default links , want restrict source , target links because want links between rect(source)
, circle(target)
.
i have tried link.on(change:source)
, link.on(change:target)
events don't launch when want.
somebody knows solution problem?
var defaultlinks = new joint.dia.link({ attrs: { '.marker-source': {transform: 'scale(0.001)' }, '.marker-target': {fill:'black', d: 'm 10 0 l 0 5 l 10 10 z' }, '.connection-wrap': { stroke: 'black' } }, smooth:true, path: [] }); defaultlinks.on('change:source',function(){ alert("change source") }); defaultlinks.on('change:target',function(){ alert("change source") }); this.paper = new joint.dia.paper({ el: this.paperscroller.el, width: 1200, height: 1000, gridsize: 10, perpendicularlinks: true, model: this.graph, defaultlink: defaultlinks });
you can use validateconnection(cellviews, magnets, cellviewt, magnett, end, linkview)
function in paper options (http://jointjs.com/api#joint.dia.paper). tutorial shows usage: http://jointjs.com/tutorial/ports#restrict. in case, use (not tested):
var paper = new joint.dia.paper({ validateconnection: function(cellviews, magnets, cellviewt, magnett, end, linkview) { // rectangle can source, if not, not allow such connection: if (cellviews.model.get('type') !== 'basic.rect') return false; // circle can target, if not, not allow such connection: if (cellviewt.model.get('type') !== 'basic.circle') return false; // connection allowed otherwise. return true; }, ... })
Comments
Post a Comment