jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-24 09:46:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

style changes to the zigbee graph, without touching the physics (#24697)

Browse Source
This commit is contained in:
Jonathan Hanson 2025-03-26 03:08:44 -07:00 committed by GitHub
parent 386b8ba747
commit ff6b318fc9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 37 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
src/panels/config/integrations/integration-panels/zha/zha-network-visualization-page.ts
View File

@ -235,23 +235,27 @@ export class ZHANetworkVisualizationPage extends LitElement {
label: this._buildLabel(device), label: this._buildLabel(device),
shape: this._getShape(device), shape: this._getShape(device),
mass: this._getMass(device), mass: this._getMass(device),
fixed: device.device_type === "Coordinator",
color: { color: {
background: device.available ? "#66FF99" : "#FF9999", background: device.available ? "#66FF99" : "#FF9999",
}, },
}); });
if (device.neighbors && device.neighbors.length > 0) { if (device.neighbors && device.neighbors.length > 0) {
device.neighbors.forEach((neighbor) => { device.neighbors.forEach((neighbor) => {
const idx = edges.findIndex( const idx = edges.findIndex(
(e) => device.ieee === e.to && neighbor.ieee === e.from (e) => device.ieee === e.to && neighbor.ieee === e.from
); );
if (idx === -1) { if (idx === -1) {
const edge_options = this._getEdgeOptions(parseInt(neighbor.lqi));
edges.push({ edges.push({
from: device.ieee, from: device.ieee,
to: neighbor.ieee, to: neighbor.ieee,
label: neighbor.lqi + "", label: neighbor.lqi + "",
color: this._getLQI(parseInt(neighbor.lqi)).color, color: edge_options.color,
width: this._getLQI(parseInt(neighbor.lqi)).width, width: edge_options.width,
length: 2000 - 4 * parseInt(neighbor.lqi), length: edge_options.length,
physics: edge_options.physics,
arrows: { arrows: {
from: { from: {
enabled: neighbor.relationship !== "Child", enabled: neighbor.relationship !== "Child",
@ -260,16 +264,14 @@ export class ZHANetworkVisualizationPage extends LitElement {
dashes: neighbor.relationship !== "Child", dashes: neighbor.relationship !== "Child",
}); });
} else { } else {
edges[idx].color = this._getLQI( const edge_options = this._getEdgeOptions(
(parseInt(edges[idx].label!) + parseInt(neighbor.lqi)) / 2 Math.min(parseInt(edges[idx].label!), parseInt(neighbor.lqi))
).color; );
edges[idx].width = this._getLQI( edges[idx].label += " & " + neighbor.lqi;
(parseInt(edges[idx].label!) + parseInt(neighbor.lqi)) / 2 edges[idx].color = edge_options.color;
).width; edges[idx].width = edge_options.width;
edges[idx].length = edges[idx].length = edge_options.length;
2000 - edges[idx].physics = edge_options.physics;
6 * ((parseInt(edges[idx].label!) + parseInt(neighbor.lqi)) / 2);
edges[idx].label += "/" + neighbor.lqi;
delete edges[idx].arrows; delete edges[idx].arrows;
delete edges[idx].dashes; delete edges[idx].dashes;
} }
@ -280,17 +282,30 @@ export class ZHANetworkVisualizationPage extends LitElement {
this._network?.setData({ nodes: this._nodes, edges: edges }); this._network?.setData({ nodes: this._nodes, edges: edges });
} }
private _getLQI(lqi: number): EdgeOptions { private _getEdgeOptions(lqi: number): EdgeOptions {
const length = 2000 - 4 * lqi;
if (lqi > 192) { if (lqi > 192) {
return { color: { color: "#17ab00", highlight: "#17ab00" }, width: 4 }; return {
color: { color: "#17ab00", highlight: "#17ab00" },
width: lqi / 20,
length: length,
physics: false,
};
} }
if (lqi > 128) { if (lqi > 128) {
return { color: { color: "#e6b402", highlight: "#e6b402" }, width: 3 }; return {
color: { color: "#e6b402", highlight: "#e6b402" },
width: 9,
length: length,
physics: false,
};
} }
if (lqi > 80) { return {
return { color: { color: "#fc4c4c", highlight: "#fc4c4c" }, width: 2 }; color: { color: "#bfbfbf", highlight: "#bfbfbf" },
} width: 1,
return { color: { color: "#bfbfbf", highlight: "#bfbfbf" }, width: 1 }; length: length,
physics: false,
};
} }
private _getMass(device: ZHADevice): number { private _getMass(device: ZHADevice): number {
@ -418,16 +433,8 @@ export class ZHANetworkVisualizationPage extends LitElement {
this._network!.setOptions( this._network!.setOptions(
this._enablePhysics this._enablePhysics
? { ? { physics: { enabled: true } }
physics: { : { physics: { enabled: false } }
barnesHut: {
springConstant: 0,
avoidOverlap: 10,
damping: 0.09,
},
},
}
: { physics: false }
); );
} }