'
+ format.push([i,'
'
+ label
+ '
']);
}
return format;
}
+ function xFormatter(v, axis) {
+ label = parseFloat(v);
+ text = label.toLocaleString();
+ if ( label >= 1000000)
+ text = text.substring(0,4) + "M";
+ else if (label >= 100000)
+ text = text.substring(0,3) + "K";
+ else if (label >= 1000)
+ text = text.substring(0,2) + "K";
+
+ return '
'+text+'
';
+ }
+
if (water_mark) {
set_watermark(graph_id, plot, $('#watermark_image_'+graph_id).attr('src'));
}
@@ -600,20 +512,30 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
},
xaxis: {
axisLabelUseCanvas: true,
- axisLabelFontSizePixels: 7,
+ axisLabelFontSizePixels: font_size,
axisLabelFontFamily: font+'Font',
axisLabelPadding: 0,
ticks: xFormatter,
labelWidth: 130,
+ labelHeight: 50,
},
yaxis: {
axisLabelUseCanvas: true,
- axisLabelFontSizePixels: 7,
+ axisLabelFontSizePixels: font_size,
axisLabelFontFamily: font+'Font',
axisLabelPadding: 100,
autoscaleMargin: 0.02,
tickFormatter: function (v, axis) {
- return v ;
+ label = parseFloat(v);
+ text = label.toLocaleString();
+ if ( label >= 1000000)
+ text = text.substring(0,4) + "M";
+ else if (label >= 100000)
+ text = text.substring(0,3) + "K";
+ else if (label >= 1000)
+ text = text.substring(0,2) + "K";
+
+ return '
'+text+'
';
}
},
legend: {
@@ -630,82 +552,43 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
}
};
+ if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
+ options.xaxis.labelWidth = 100;
+
var plot = $.plot($('#'+graph_id),datas, options );
$('#' + graph_id).VUseTooltip();
$('#' + graph_id).css("margin-left","auto");
$('#' + graph_id).css("margin-right","auto");
- $('#' + graph_id).find('div.legend-tooltip').tooltip({ track: true });
- // Adjust the top of yaxis tick to set it in the middle of the bars
- //yAxisHeight = $('#'+graph_id+' .yAxis .tickLabel').css('height').split('px')[0];
-
- //plot.getPlaceholder().onload = function(){pruebas};
- //~ i = 0;
- //~ $('#'+graph_id+' .xAxis .tickLabel').each(function() {
- //~ $(this).css('display','none');
- //~ $(this).addClass("legend_"+i);
- //~ i++;
- //~ tickNewTop = parseInt(parseInt(tickTop) - (yAxisHeight/2)-3);
- //~ $(this).css('top', tickNewTop+'px');
- //~
- //~ valuesNewTop = parseInt(parseInt(tickTop) - (yAxisHeight));
- //~
- //~ $('#value_'+i+'_'+graph_id).css('top',parseInt(plot.offset().top) + parseInt(valuesNewTop));
-//~
- //~ pixelPerValue = parseInt(plot.width()) / maxvalue;
- //~
- //~ inCanvasValuePos = parseInt(pixelPerValue * ($('#value_'+i+'_'+graph_id).html()));
- //~
- //~ $('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3);
- //~ });
-
- // When resize the window, adjust the values
- //~ $('#'+graph_id).parent().resize(function () {
- //~ i = 0;
- //~ pixelPerValue = parseInt(plot.width()) / maxvalue;
- //~
- //~ $('#'+graph_id+' .yAxis .tickLabel').each(function() {
- //~ inCanvasValuePos = parseInt(pixelPerValue * ($('#value_'+i+'_'+graph_id).html()));
- //~
- //~ $('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3);
- //~ i++;
- //~ });
- //~ });
-
-
-
- $('#'+graph_id+' .yAxis .tickLabel').each(function() {
- label = parseFloat($(this).text());
- text = label.toLocaleString();
- if ( label >= 1000000)
- text = text.substring(0,4) + "M";
- else if (label >= 100000)
- text = text.substring(0,3) + "K";
- else if (label >= 1000)
- text = text.substring(0,2) + "K";
-
- $(this).text(text);
- });
+ //~ $('#' + graph_id).find('div.legend-tooltip').tooltip({ track: true });
$('#'+graph_id+' .xAxis .tickLabel')
.css('transform', 'rotate(-45deg)')
+ .css('max-width','100px')
.find('div')
.css('position', 'relative')
.css('top', '+10px')
- .css('left', '-20px');
-
+ .css('left', '-30px');
+ if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
+ $('#'+graph_id+' .xAxis .tickLabel')
+ .find('div')
+ .css('top', '+0px')
+ .css('left', '-20px');
// Format functions
function xFormatter(v, axis) {
var format = new Array();
for (i = 0; i < labels_total.length; i++) {
var label = labels_total[i][1];
- var shortLabel = reduceText(label, 35);
+ var shortLabel = reduceText(label, 28);
+ if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))
+ shortLabel = reduceText(label, 18);
var title = '';
if (label !== shortLabel) {
title = label;
label = shortLabel;
}
+
format.push([i,
- '
'
+ '
'
+ label
+ '
']);
}
@@ -713,22 +596,13 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
}
function yFormatter(v, axis) {
- return v;
+ return '
'+v+'
';
}
function lFormatter(v, axis) {
- return '
'+v+'
';
+ return '
'+v+'
';
}
-
- // Events
- //~ $('#'+graph_id).bind('plothover', function (event, pos, item) {
- //~ $('.values_'+graph_id).css('font-weight', '');
- //~ if(item != null) {
- //~ index = item.dataIndex;
- //~ $('#value_'+index+'_'+graph_id).css('font-weight', 'bold');
- //~ }
- //~ });
-
+
if (water_mark) {
set_watermark(graph_id, plot, $('#watermark_image_'+graph_id).attr('src'));
}
@@ -1581,7 +1455,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend,
// Re-calculate the graph height with the legend height
if (dashboard || vconsole) {
var hDiff = $('#'+graph_id).height() - $('#legend_'+graph_id).height();
- if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ){
+ if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ){
}
else {
$('#'+graph_id).css('height', hDiff);
@@ -1874,18 +1748,18 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend,
if (labels[v] == undefined) {
return '';
}
- return '
'+labels[v]+'
';
+ return '
'+labels[v]+'
';
}
function yFormatter(v, axis) {
axis.datamin = 0;
var formatted = number_format(v,force_integer,unit);
- return '
'+formatted+'
';
+ return '
'+formatted+'
';
}
function lFormatter(v, item) {
- return '
'+v+'
';
+ return '
'+v+'
';
// Prepared to turn series with a checkbox
//return '
'+v+'
';
}
@@ -1994,7 +1868,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend,
$('#legend_'+graph_id).css('margin-bottom', '10px');
parent_height = parseInt(
$('#menu_'+graph_id).parent().css('height').split('px')[0]);
- adjust_menu(graph_id, plot, parent_height);
+ adjust_menu(graph_id, plot, parent_height, width);
}
if (!dashboard) {
@@ -2195,5 +2069,6 @@ function add_threshold (data_base, threshold_data, y_min, y_max, yellow_threshol
function reduceText (text, maxLength) {
if (text.length <= maxLength) return text
var firstSlideEnd = parseInt((maxLength - 3) / 2);
- return text.substr(0, firstSlideEnd) + '...' + text.substr(-firstSlideEnd - 3);
+ var str_cut = text.substr(0, firstSlideEnd);
+ return str_cut + '...' + text.substr(-firstSlideEnd - 3);
}