Various chart improvements.

This commit is contained in:
Herbert Wolverson 2023-05-15 16:58:03 +00:00
parent 614685ba49
commit ea7ec93c80
11 changed files with 58 additions and 41 deletions

View File

@ -45,6 +45,9 @@ pub async fn get_site_id_from_name(
key: &str,
site_name: &str,
) -> Result<i32, StatsHostError> {
if site_name == "root" {
return Ok(0);
}
let site_id_db = sqlx::query("SELECT index FROM site_tree WHERE key = $1 AND site_name=$2")
.bind(key)
.bind(site_name)

View File

@ -31,8 +31,8 @@ export class PacketsChart implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -70,7 +70,7 @@ export class PacketsChart implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -114,7 +114,7 @@ export class PacketsChart implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -35,8 +35,8 @@ export class PacketsChartSingle implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -74,7 +74,7 @@ export class PacketsChartSingle implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -118,7 +118,7 @@ export class PacketsChartSingle implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -36,7 +36,7 @@ export class RootHeat implements Component {
keys.push(key);
}
keys = keys.sort().reverse();
console.log(keys);
//console.log(keys);
for (let j=0; j<keys.length; j++) {
let key = keys[j];

View File

@ -31,8 +31,8 @@ export class ThroughputChart implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -70,7 +70,7 @@ export class ThroughputChart implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -114,7 +114,7 @@ export class ThroughputChart implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -33,8 +33,8 @@ export class ThroughputCircuitChart implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -72,7 +72,7 @@ export class ThroughputCircuitChart implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -116,7 +116,7 @@ export class ThroughputCircuitChart implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -35,8 +35,8 @@ export class ThroughputChartSingle implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -74,7 +74,7 @@ export class ThroughputChartSingle implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -118,7 +118,7 @@ export class ThroughputChartSingle implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -33,8 +33,8 @@ export class ThroughputSiteChart implements Component {
let legend: string[] = [];
for (let i=0; i<event.nodes.length; i++) {
let node = event.nodes[i];
legend.push(node.node_name + " DL");
legend.push(node.node_name + " UL");
legend.push(node.node_name);
//legend.push(node.node_name + " UL");
//console.log(node);
let d: number[] = [];
@ -72,7 +72,7 @@ export class ThroughputSiteChart implements Component {
},
};
let val: echarts.SeriesOption = {
name: node.node_name + " DL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',
@ -116,7 +116,7 @@ export class ThroughputSiteChart implements Component {
},
};
val = {
name: node.node_name + " UL",
name: node.node_name,
type: "line",
data: d,
symbol: 'none',

View File

@ -8,6 +8,7 @@ import { ThroughputChart } from '../components/throughput';
import { RttChart } from '../components/rtt_graph';
import { RttHisto } from '../components/rtt_histo';
import { RootHeat } from '../components/root_heat';
import { SiteStackChart } from '../components/site_stack';
export class DashboardPage implements Page {
menu: MenuPage;
@ -26,6 +27,7 @@ export class DashboardPage implements Page {
new RttChart(),
new RttHisto(),
new RootHeat(),
new SiteStackChart("root"),
];
}

View File

@ -40,6 +40,16 @@
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<div id="siteStack" style="height: 900px"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">

View File

@ -109,6 +109,7 @@ function buildTree(data: TreeItem[]) {
for (let i=0; i<data.length; i++) {
if (data[i].parent == 0) {
if (data[i].site_name != "Root") {
let up = (data[i].current_up / (data[i].max_up * mbps_to_bps)) * 100.0;
let down = (data[i].current_down / (data[i].max_down * mbps_to_bps)) * 100.0;
let peak = Math.max(up, down);
@ -127,6 +128,7 @@ function buildTree(data: TreeItem[]) {
def += graphChildren(data, data[i].index, 1);
}
}
}
html += "</tbody></table>";
tree.innerHTML = html;