Abuse error bars to show packet durations on dump view.

This commit is contained in:
Herbert Wolverson 2023-03-15 15:04:22 +00:00
parent 521b383ef7
commit d542bf1660
2 changed files with 13 additions and 5 deletions

View File

@ -573,10 +573,12 @@
let ip_btns = "";
for (let i=0; i<ips.length; ++i) {
ip_list += ips[i] + ",";
ip_btns += "<a href='/ip_dump?ip=" + ips[i] + "' class='btn btn-info'>Packet Dump: " + ips[i] + "</a>"
if (circuit_info != null) {
ip_btns += "<a href='/ip_dump?ip=" + ips[i] + "&dn=" + circuit_info.capacity[0] + "&up=" + circuit_info.capacity[1] + "' class='btn btn-info'>Packet Dump: " + ips[i] + "</a>"
}
}
ip_btns += "<br />";
if (!madeButtons && ips.length > 0) {
if (!madeButtons && ips.length > 0 && circuit_info != null) {
madeButtons = true;
$("#packetButtons").html(ip_btns);
}

View File

@ -79,6 +79,7 @@
var PAGE_SIZE = 1000;
var target = "";
var current_page = 0;
var capacity = [];
function proto(n) {
switch (n) {
@ -156,11 +157,11 @@
// Make the graph
let graph = document.getElementById("graph");
let data = [
{x: x_axis, y:y1_axis, name: 'Download', type: 'scatter', mode: 'markers'},
{x: x_axis, y:y2_axis, name: 'Upload', type: 'scatter', mode: 'markers'}
{x: x_axis, y:y1_axis, name: 'Download', type: 'scatter', mode: 'markers', error_x: { type: 'percent', value: capacity[0], symetric: false, valueminus: 0 }},
{x: x_axis, y:y2_axis, name: 'Upload', type: 'scatter', mode: 'markers', error_x: { type: 'percent', value: capacity[1], symetric: false, valueminus: 0 }},
];
Plotly.newPlot(graph, data, { margin: { l:0,r:0,b:0,t:0,pad:4 }, yaxis: { automargin: true, title: 'Bytes' }, xaxis: {automargin: true, title: "Nanoseconds"} }, { responsive: true });
}
}
function start() {
colorReloadButton();
@ -169,6 +170,11 @@
get: (searchParams, prop) => searchParams.get(prop),
});
capacity = [ params.dn, params.up ]; // Bits per second
capacity = [ capacity[0] / 8, capacity[1] / 8 ]; // Bytes per second
capacity = [ capacity[0] / 1e9, capacity[1] / 1e9 ]; // Bytes per nanosecond
target = params.ip;
$.get("/api/packet_dump/" + params.ip, (data) => {
data.sort((a,b) => a<b);