Render the legend ourselves, thus removing it from the chart.

This commit is contained in:
Simon MacMullen 2012-12-18 15:56:20 +00:00
parent cbb334c042
commit b34771f52f
3 changed files with 30 additions and 11 deletions

View File

@ -136,6 +136,8 @@ p.status-error, p.warning { margin: 20px; padding: 15px; border-radius: 10px; -m
.chart-medium { width: 600px; height: 200px; }
.chart-large { width: 800px; height: 300px; }
.chart-legend { float: left; }
.mini-highlight { font-size: 150%; padding:10px; background-color: #ddd; color: #888; border-radius: 10px; -moz-border-radius: 10px; line-height: 300%; }
.micro-highlight { min-width: 120px; font-size: 100%; text-align:center; padding:10px; background-color: #ddd; margin: 0 20px 0 0; color: #888; border-radius: 10px; -moz-border-radius: 10px; }

View File

@ -4,6 +4,8 @@ function render_charts() {
});
}
var chart_colors = ['#edc240', '#afd8f8', '#cb4b4b', '#4da74d', '#9440ed'];
function render_chart(div) {
var id = div.attr('id').substring('chart-'.length);
var rate_mode = div.hasClass('chart-rates');
@ -13,23 +15,24 @@ function render_chart(div) {
grid: { borderWidth: 2, borderColor: "#aaa" },
xaxis: { tickColor: "#fff", mode: "time" },
yaxis: { tickColor: "#eee", min: 0 },
legend: { position: 'se', backgroundOpacity: 0.5 }
legend: { show: false }
};
var out_data = [];
var i = 0;
for (var name in chart_data[id]) {
var data = chart_data[id][name];
var samples = data.samples;
var d = [];
for (var i = 1; i < samples.length; i++) {
var x = samples[i].timestamp;
for (var j = 1; j < samples.length; j++) {
var x = samples[j].timestamp;
var y;
if (rate_mode) {
y = (samples[i - 1].sample - samples[i].sample) * 1000 /
(samples[i - 1].timestamp - samples[i].timestamp);
y = (samples[j - 1].sample - samples[j].sample) * 1000 /
(samples[j - 1].timestamp - samples[j].timestamp);
}
else {
y = samples[i].sample;
y = samples[j].sample;
}
d.push([x, y]);
}
@ -40,7 +43,8 @@ function render_chart(div) {
else {
suffix = " (" + samples[0].sample + " msg)";
}
out_data.push({label: name + suffix, data: d});
out_data.push({data: d, color: chart_colors[i]});
i++;
}
chart_data[id] = {};

View File

@ -591,18 +591,31 @@ function rates_chart_or_text(id, stats, items, rates_counts) {
function rates_chart(id, items, stats, rates_counts) {
var size = get_pref('chart-size-' + id);
var show = false;
var show = [];
chart_data[id] = {};
for (var i in items) {
var name = items[i][0];
var key = items[i][1] + '_details';
if (key in stats) {
chart_data[id][name] = stats[key];
show = true;
if (rates_counts == 'rates') {
show.push([name, stats[key].rate + " msg/s"]);
}
else {
show.push([name, stats[key].samples[0].sample + " msg"]);
}
}
}
return show ? '<div id="chart-' + id + '" class="chart chart-' + size +
' chart-' + rates_counts + '"></div>' : '';
var html = '<div id="chart-' + id + '" class="chart chart-' + size +
' chart-' + rates_counts + '"></div>';
html += '<table class="facts">';
for (var i = 0; i < show.length; i++) {
html += '<tr><th>' + show[i][0] + '</th><td>';
html += '<div class="memory-key" style="background: ' + chart_colors[i];
html += ';"></div>' + show[i][1] + '</td></tr>'
}
html += '</table>';
return show.length > 0 ? html : '';
}
function rates_text(items, stats, mode, rates_counts) {