Se si aggiunge un elemento <title />
al markup SVG alle vostre definizioni di forma (questo presuppone che si sta utilizzando forme personalizzate):
<..shape markup...><title /><...end of shape markup...>
Così, per esempio, il vostro codice potrebbe essere simile a questo:
<g class="rotatable">
<g class="scalable">
<circle class="element-process"/>
<title />
</g><text/>
</g>
Quindi è possibile aggiungere un tooltip statica nel link definizione dell'elemento questo:
joint.shapes.custom.myCircle = joint.shapes.basic.Generic.extend({
markup: '<g class="rotatable"><g class="scalable"><circle class="element-process"/><title /></g><text/></g>',
defaults: joint.util.deepSupplement({
type: 'custom.myCircle,
attrs: {
title: {text: 'Static Tooltip'},
'.element-process': { 'stroke-width': 1, r: 30, stroke: 'black', transform: 'translate(30, 30)' },
text: { ref: '.element-process'}
},
size: { width: 100, height: 100 }
}, joint.shapes.basic.Generic.prototype.defaults)
});
o omettere/sovrascrivere il title: {text: 'Static Tooltip'}
e definire il testo della descrizione comandi più avanti nel codice:
var cell = new joint.shapes.custom.myCircle();
var toolTip = 'Dynamic Tooltip Text;
cell.attr('title/text', toolTip);
fonte
2015-04-14 22:55:41
'joint.ui.Tooltip' è solo nella (pagato) Rappid toolkit, non il (gratuito) Jointjs toolkit. –