diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg b/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg
index 8f01075d0b..aca186402e 100644
--- a/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg
+++ b/modules/luci-mod-status/htdocs/luci-static/resources/svg/channel_analysis.svg
@@ -16,4 +16,21 @@
-90 dbm
+
+
+
+
+
+
+
+
diff --git a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js
index f7e349409a..54e9054aa8 100644
--- a/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js
+++ b/modules/luci-mod-status/htdocs/luci-static/resources/view/status/channel_analysis.js
@@ -63,7 +63,41 @@ return view.extend({
if (scanCache[res.bssid].graph == null)
scanCache[res.bssid].graph = [];
- function add_channel_to_graph(chan_analysis, res, scanCache, i, channel, channel_width, label) {
+ channels.forEach(function(channel) {
+ if (scanCache[res.bssid].graph[i] == null) {
+ var group = document.createElementNS('http://www.w3.org/2000/svg', 'g'),
+ line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline'),
+ text = document.createElementNS('http://www.w3.org/2000/svg', 'text'),
+ color = scanCache[res.bssid].color;
+
+ line.setAttribute('style', 'fill:'+color+'4f'+';stroke:'+color+';stroke-width:0.5');
+ text.setAttribute('style', 'fill:'+color+';font-size:9pt; font-family:sans-serif; text-shadow:1px 1px 1px #000');
+ text.appendChild(document.createTextNode(res.ssid || res.bssid));
+
+ group.appendChild(line)
+ group.appendChild(text)
+
+ chan_analysis.graph.firstElementChild.appendChild(group);
+ scanCache[res.bssid].graph[i] = { group : group, line : line, text : text };
+ }
+ if (channel_width > 2) {
+ if (!("main" in scanCache[res.bssid].graph[i])) {
+ var main = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');
+ main.setAttribute('style', 'fill:url(#GradientVerticalCenteredBlack)');
+ scanCache[res.bssid].graph[i].group.appendChild(main)
+ chan_analysis.graph.firstElementChild.lastElementChild.appendChild(main);
+ scanCache[res.bssid].graph[i]["main"] = main;
+ }
+ var main_offset = offset_tbl[res.channel],
+ points = [
+ (main_offset-(step*(2 )))+','+height,
+ (main_offset-(step*(2-1)))+','+height_diff,
+ (main_offset+(step*(2-1)))+','+height_diff,
+ (main_offset+(step*(2 )))+','+height
+ ];
+ scanCache[res.bssid].graph[i].main.setAttribute('points', points);
+ }
+
var chan_offset = offset_tbl[channel],
points = [
(chan_offset-(step*(channel_width )))+','+height,
@@ -72,41 +106,12 @@ return view.extend({
(chan_offset+(step*(channel_width )))+','+height
];
- if (scanCache[res.bssid].graph[i] == null) {
- var group = document.createElementNS('http://www.w3.org/2000/svg', 'g'),
- line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline'),
- text = null,
- color = scanCache[res.bssid].color;
-
- line.setAttribute('style', 'fill:'+color+'4f'+';stroke:'+color+';stroke-width:0.5');
- group.appendChild(line)
-
- if (label != null) {
- text = document.createElementNS('http://www.w3.org/2000/svg', 'text');
- text.setAttribute('style', 'fill:'+color+';font-size:9pt; font-family:sans-serif; text-shadow:1px 1px 1px #000');
- text.appendChild(document.createTextNode(label));
- group.appendChild(text)
- }
-
- chan_analysis.graph.firstElementChild.appendChild(group);
- scanCache[res.bssid].graph[i] = { group : group, line : line, text : text };
- }
-
- if (scanCache[res.bssid].graph[i].text != null) {
- scanCache[res.bssid].graph[i].text.setAttribute('x', offset_tbl[res.channel]-step);
- scanCache[res.bssid].graph[i].text.setAttribute('y', height_diff - 2);
- }
+ scanCache[res.bssid].graph[i].text.setAttribute('x', offset_tbl[res.channel]-step);
+ scanCache[res.bssid].graph[i].text.setAttribute('y', height_diff - 2);
scanCache[res.bssid].graph[i].line.setAttribute('points', points);
scanCache[res.bssid].graph[i].group.style.zIndex = res.signal*-1;
scanCache[res.bssid].graph[i].group.style.opacity = res.stale ? '0.5' : null;
- }
-
- channels.forEach(function(channel) {
- add_channel_to_graph(chan_analysis, res, scanCache, i, channel, channel_width, res.ssid || res.bssid);
})
- if (channel_width > 2) {
- add_channel_to_graph(chan_analysis, res, scanCache, i+1, res.channel, 2, null);
- }
},
create_channel_graph: function(chan_analysis, freq_tbl, band) {