在 D3 中使用 Tipsy 缩小悬停文本

Question

Tipsy 用于将鼠标悬停在我的节点上时显示大量文本，我想使该文本更小。我该怎么做？

$('.node').tipsy({ 
    gravity: 'w', 
    html: true, 
    title: function() {
        var d = this.__data__, id = d.id, inc_calls = d.inc_calls, out_calls = d.out_calls, inc_texts = d.inc_texts, out_texts = d.out_texts;
        return 'Incoming Calls: ' + inc_calls + '<br/>' + 'Outgoing Calls: ' + out_calls + '<br/>' + 'Incoming Texts: ' + inc_texts + '<br/>' + 'Outgoing Texts: ' + out_texts ; 
    }
});

Answer 1

将

您要返回的标题文本包装为具有您希望的字体大小的样式范围..例如，我将字体大小设置为10 px，您可以将其重置为适合您情况的大小。

<span style="font-size:10px">+ your_title_text +</span>

$('.node').tipsy({ 
                gravity: 'w', 
                html: true, 
                title: function() {
                  var d = this.__data__, id = d.id, inc_calls = d.inc_calls, out_calls = d.out_calls, inc_texts = d.inc_texts, out_texts = d.out_texts;
                  return '<span style="font-size:10px">Incoming Calls: ' + inc_calls + '<br/>' + 'Outgoing Calls: ' + out_calls + '<br/>' + 'Incoming Texts: ' + inc_texts + '<br/>' + 'Outgoing Texts: ' + out_texts + '</span>' ; 
                }
              });