2017-08-10 3 views
0

J'ai créé un graphique de flot avec jQuery Flot mais pour le moment, j'ai une longue étiquette sur l'axe des x et elle était tronquée avec ... à la fin de la chaîne.Comment ajouter une info-bulle à l'étiquette d'axe avec jQuery Flot

J'ai besoin d'ajouter une info-bulle sur l'étiquette de l'axe x pour voir l'étiquette complète.

J'ai joint la capture d'écran.

enter image description here

Ou est-il de personnaliser le rendu axe label (HTML)?

Merci

+0

J'ai corrigé cet ajout en passant la chaîne HTML dans les options ticks. –

Répondre

0

question similaires déjà Answerd par: Mark dans Question

Voici une tentative d'utiliser votre CSS et faire un peu à la volée des ajustements pour que les choses s'adapter:

// push the labels down half their width 
// while we are at it find longest label height 
var longest = -1; 
$('#flot_chart .xAxis .tickLabel').each(function(){ 
    var self = $(this); 
    var width = self.width(); 
    self.css('top',parseInt(self.css('top')) + width/2 - 5); 
    if (width > longest){ 
     longest = width; 
    } 
}); 

// now adjust the chart height so we don't overflow 
$("#flot_chart").height($("#flot_chart").height() + longest - $('#flot_chart .xAxis .tickLabel').height() + 5); 

JSFiddle

0

J'ai corrigé cet ajout en passant la chaîne HTML dans ticks options.

JQuery Flot injecte la chaîne HTML dans le conteneur float-x # -label.