Render the legend ourselves, thus removing it from the chart.
This commit is contained in:
parent
cbb334c042
commit
b34771f52f
|
|
@ -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; }
|
||||
|
|
|
|||
|
|
@ -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] = {};
|
||||
|
||||
|
|
|
|||
|
|
@ -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) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue