Current File : //home/infra/dashboard/front/js/jquery.flot.valuelabels.js
/**
* Value Labels Plugin for flot.
* http://leonardoeloy.github.com/flot-valuelabels
* http://wiki.github.com/leonardoeloy/flot-valuelabels/
*
* Using canvas.fillText instead of divs, which is better for printing - by Leonardo Eloy, March 2010.
* Tested with Flot 0.6 and JQuery 1.3.2.
*
* Original homepage: http://sites.google.com/site/petrsstuff/projects/flotvallab
* Released under the MIT license by Petr Blahos, December 2009.
*/
(function ($) {
var options = {
series: {
valueLabels: {
show: false,
showAsHtml: false, // Set to true if you wanna switch back to DIV usage (you need plot.css for this)
showLastValue: false, // Use this to show the label only for the last value in the series
labelFormatter: function(v) { return v; }, // Format the label value to what you want
align: 'start', // can also be 'center', 'left' or 'right'
plotAxis: 'y', // Set to the axis values you wish to plot
hideZero: false
}
}
};
function init(plot) {
plot.hooks.draw.push( function (plot, ctx) {
$.each(plot.getData(), function(ii, series) {
if (!series.valueLabels.show) return;
var showLastValue = series.valueLabels.showLastValue;
var showAsHtml = series.valueLabels.showAsHtml;
var plotAxis = series.valueLabels.plotAxis;
var labelFormatter = series.valueLabels.labelFormatter;
var fontcolor = series.valueLabels.fontcolor;
var xoffset = series.valueLabels.xoffset;
var yoffset = series.valueLabels.yoffset;
var align = series.valueLabels.align;
var font = series.valueLabels.font;
var hideZero = series.valueLabels.hideZero;
// Workaround, since Flot doesn't set this value anymore
series.seriesIndex = ii;
if (showAsHtml) {
plot.getPlaceholder().find("#valueLabels"+ii).remove();
}
var html = '<div id="valueLabels' + series.seriesIndex + '" class="valueLabels">';
var last_val = null;
var last_x = -1000;
var last_y = -1000;
var categories = series.xaxis.options.mode == 'categories';
for (var i = 0; i < series.data.length; ++i) {
if (series.data[i] === null || (showLastValue && i != series.data.length-1)) continue;
var x = series.data[i][0], y = series.data[i][1];
if (categories) {
x = series.xaxis.categories[x];
}
if (x < series.xaxis.min || x > series.xaxis.max || y < series.yaxis.min || y > series.yaxis.max) continue;
var val = ( plotAxis === 'x' ) ? x : y;
if(val == null){val=''}
if ( val === 0 && hideZero ) continue;
if (series.valueLabels.valueLabelFunc) {
val = series.valueLabels.valueLabelFunc({ series: series, seriesIndex: ii, index: i });
}
val = "" + val;
val = labelFormatter(val);
if (val != last_val || i == series.data.length - 1) {
var xx = series.xaxis.p2c(x) + plot.getPlotOffset().left;
var yy = series.yaxis.p2c(y) - 12 + plot.getPlotOffset().top;
if ( Math.abs(yy - last_y) > 20 || last_x < xx) {
last_val = val;
last_x = xx + val.length * 8;
last_y = yy;
if (!showAsHtml) {
// Little 5 px padding here helps the number to get
// closer to points
x_pos = xx;
y_pos = yy + 6;
// If the value is on the top of the canvas, we need
// to push it down a little
if (yy <= 0) y_pos = 18;
// The same happens with the x axis
if (xx >= plot.width()) {
x_pos = plot.width();
}
if (font) {
ctx.font = font;
}
if(typeof(fontcolor) != 'undefined'){
ctx.fillStyle = fontcolor;
}
ctx.shadowOffsetX = 0;
ctx.shadowOffsetY = 0;
ctx.shadowBlur = 1.5;
if(typeof(fontcolor) != 'undefined'){
ctx.shadowColor = fontcolor;
}
ctx.textAlign = align;
ctx.fillText(val, x_pos, y_pos);
}
else {
var head = '<div style="left:' + xx + 'px;top:' + yy + 'px;" class="valueLabel';
var tail = '">' + val + '</div>';
html += head + "Light" + tail + head + tail;
}
}
}
}
if (showAsHtml) {
html += "</div>";
plot.getPlaceholder().append(html);
}
});
});
}
$.plot.plugins.push({
init: init,
options: options,
name: 'valueLabels',
version: '1.2'
});
})(jQuery);
Mini Shell