Commit 1e92a142 authored by Vincent Pelletier's avatar Vincent Pelletier

Add graph tooltips showing point values.

parent 21c24940
......@@ -147,7 +147,7 @@ def prepareDataForGraph(daily_data, date_format, placeholder_delta):
def graphPair(daily_data, date_format, graph_period):
date_list = [int(time.mktime(time.strptime(x[0], date_format)) * 1000)
for x in daily_data]
timeformat = '%Y<br/>%m/%d<br/>%H:%M'
timeformat = '%Y/<br/>%m/%d<br/> %H:%M'
# There is room for about 10 labels on the X axis.
minTickSize = (max(1,
(date_list[-1] - date_list[0]) / (60 * 60 * 1000 * 10)), 'hour')
......@@ -155,7 +155,7 @@ def graphPair(daily_data, date_format, graph_period):
yLabelWidth = max(int(math.log10(max(x[2] for x in daily_data))) + 1,
3) * 6
return graph('apdex',
[zip(date_list, (x[1] for x in daily_data))],
[zip(date_list, (round(x[1], 2) for x in daily_data))],
{
'xaxis': {
'mode': 'time',
......@@ -164,10 +164,13 @@ def graphPair(daily_data, date_format, graph_period):
},
'yaxis': {
'max': 100,
'axisLabel': '%',
'axisLabel': 'apdex (%)',
'labelWidth': yLabelWidth,
},
'lines': {'show': True},
'grid': {
'hoverable': True,
},
},
) + graph('Hits (per %s)' % graph_period,
[zip(date_list, (x[2] for x in daily_data))],
......@@ -183,6 +186,9 @@ def graphPair(daily_data, date_format, graph_period):
'tickDecimals': 0,
},
'lines': {'show': True},
'grid': {
'hoverable': True,
},
},
)
......@@ -194,7 +200,9 @@ def graph(title, data, options={}):
append(escape(json.dumps(data), quote=True))
append('" data-options="')
append(escape(json.dumps(options), quote=True))
append('"></div>')
append('"></div><div class="tooltip">'
'<span class="x"></span><br/>'
'<span class="y"></span></div>')
return ''.join(result)
class APDEXStats(object):
......@@ -729,6 +737,9 @@ def main():
'h2 { background-color: #eee; } '
'.axisLabels { color: rgb(84,84,84) !important; }'
'.flot-x-axis .tickLabel { text-align: center; } '
'.tooltip { position: absolute; display: none; padding: 0.1em; '
'border: 1px solid #000; background-color: #fff; opacity: 0.80; } '
'.tooltip .x br { display: none; }'
'</style>')
for script in ('jquery.js', 'jquery.flot.js', 'jquery.flot.time.js',
'jquery.flot.axislabels.js'):
......@@ -741,10 +752,38 @@ def main():
args.js, script))
out.write('<script type="text/javascript">$(function() {'
'$(".graph").each(function (i){'
'$.plot('
'this,'
'$.parseJSON($(this).attr("data-points")),'
'$.parseJSON($(this).attr("data-options")));'
'var container = $(this);'
'var previousIndex = null;'
'var tooltip = container.next(".tooltip");'
'var plot = $.plot('
'container,'
'$.parseJSON(container.attr("data-points")),'
'$.parseJSON(container.attr("data-options")));'
'function formatValue(axis, value) {'
'var result = "";'
'if (axis.options.axisLabel) {'
'result = axis.options.axisLabel + " : ";'
'}'
'return result + axis.tickFormatter(value, axis);'
'}'
'container.bind("plothover", function (event, pos, item) {'
'if (item) {'
'if (previousIndex != item.dataIndex) {'
'previousIndex = item.dataIndex;'
'tooltip.css("left", item.pageX + 5 + "px");'
'tooltip.css("top", item.pageY + 5 + "px");'
'tooltip.find(".x").html(formatValue('
'item.series.xaxis, item.datapoint[0]));'
'tooltip.find(".y").text(item.datapoint[1]);'
'tooltip.show();'
'}'
'} else {'
'if (previousIndex != null) {'
'tooltip.hide();'
'previousIndex = null;'
'}'
'}'
'});'
'});'
'});</script>')
out.write('</head><body><h1>Overall</h1><h2>Parameters</h2>'
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment