ua1zbe
/
openwebrxplus
mirror of https://github.com/luarvique/openwebrx
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Adding modular spectrum display.

This commit is contained in:
Marat Fayzullin 2023-03-24 00:31:18 -04:00
parent dd908c0917
commit e56f9de7d3
2 changed files with 44 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
htdocs/index.html
View File

@ -43,6 +43,9 @@
<div id="webrx-page-container">
${header}
<div class="openwebrx-waterfall-container">
<div id="openwebrx-spectrum-container">
<canvas id="openwebrx-spectrum-canvas" width="0" height="0"></canvas>
</div>
<div id="openwebrx-frequency-container">
<div id="openwebrx-bookmarks-container" style="z-index:2;">
<div class="openwebrx-button openwebrx-round-button openwebrx-tune-button" style="position:absolute;top:30%;left:0;z-index:3;" title="Tune down" onclick="tuneBySteps(-1);">

41
htdocs/lib/Spectrum.js Normal file
View File

@ -0,0 +1,41 @@
function Spectrum(id) {
this.el = document.getElementById(id);
this.ctx = this.el.getContext("2d");
}
Spectrum.prototype.draw = function(data) {
var vis_freq = get_visible_freq_range();
var vis_center = vis_freq.center;
var vis_start = 0.5 - (center_freq - vis_freq.start) / bandwidth;
var vis_end = 0.5 - (center_freq - vis_freq.end) / bandwidth;
var data_start = Math.round(fft_size * vis_start);
var data_end = Math.round(fft_size * vis_end);
var data_width = data_end - data_start;
var data_height = Math.abs(waterfall_min_level - waterfall_max_level);
var spec_width = window.screen.width;
var spec_height = 100;
ctx.clearRect(0, 0, spec_width,spec_height);
if(spec_width > data_width)
{
var x_ratio = data_width / spec_width;
var y_ratio = spec_height / data_height;
for(var x=0; x<spec_width; x++)
{
var y = data[data_start + j * x_ratio] * y_ratio;
ctx.drawRect(x, 0, x+1, y);
}
}
else
{
var x_ratio = spec_width / data_width;
var y_ratio = spec_height / data_height;
for(var x=0; x<data_width; x++)
{
var y = data[data_start + j] * y_ratio;
ctx.drawRect(x * x_ratio, 0, (x+1) * x_ratio, y);
}
}
};