Mirror/betaflight
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight.git synced 2025-07-19 22:35:23 +03:00
Code Issues Wiki Activity

scalable graphs

Browse source
This commit is contained in:
cTn 2014-05-05 12:11:52 +02:00
parent 801592da97
commit ce9110e45d
2 changed files with 22 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

2
tabs/sensors.css
View file

@ -65,7 +65,7 @@
.tab-sensors svg { .tab-sensors svg {
float: left; float: left;
width: 730px; /* BEWARE of scrollbar DPI scaling */ width: calc(100% - 168px); /* - (plot control, margin)*/
height: 140px; height: 140px;
margin-bottom: 10px; margin-bottom: 10px;

27
tabs/sensors.js
View file

@ -41,12 +41,16 @@ function tab_initialize_sensors() {
} }
function updateGraphHelperSize(selector, helpers) { function updateGraphHelperSize(selector, helpers) {
var target_e = $(selector);
var margin = {top: 20, right: 20, bottom: 10, left: 40}; var margin = {top: 20, right: 20, bottom: 10, left: 40};
helpers.width = $(selector).width() - margin.left - margin.right; helpers.width = target_e.width() - margin.left - margin.right;
helpers.height = $(selector).height() - margin.top - margin.bottom; helpers.height = target_e.height() - margin.top - margin.bottom;
helpers.widthScale.range([0, helpers.width]); helpers.widthScale.range([0, helpers.width]);
helpers.heightScale.range([helpers.height, 0]); helpers.heightScale.range([helpers.height, 0]);
helpers.xGrid.tickSize(-helpers.height, 0, 0);
helpers.yGrid.tickSize(-helpers.width, 0, 0);
} }
function initGraphHelpers(selector, sampleNumber, heightDomain) { function initGraphHelpers(selector, sampleNumber, heightDomain) {
@ -60,20 +64,21 @@ function tab_initialize_sensors() {
.clamp(true) .clamp(true)
.domain(heightDomain || [1, -1]); .domain(heightDomain || [1, -1]);
helpers.xGrid = d3.svg.axis();
helpers.yGrid = d3.svg.axis();
updateGraphHelperSize(selector, helpers); updateGraphHelperSize(selector, helpers);
helpers.xGrid = d3.svg.axis() helpers.xGrid
.scale(helpers.widthScale) .scale(helpers.widthScale)
.orient("bottom") .orient("bottom")
.ticks(5) .ticks(5)
.tickSize(-helpers.height, 0, 0)
.tickFormat(""); .tickFormat("");
helpers.yGrid = d3.svg.axis() helpers.yGrid
.scale(helpers.heightScale) .scale(helpers.heightScale)
.orient("left") .orient("left")
.ticks(5) .ticks(5)
.tickSize(-helpers.width, 0, 0)
.tickFormat(""); .tickFormat("");
helpers.xAxis = d3.svg.axis() helpers.xAxis = d3.svg.axis()
@ -335,6 +340,8 @@ function tab_initialize_sensors() {
function update_imu_graphs() { function update_imu_graphs() {
if (checkboxes[0]) { if (checkboxes[0]) {
updateGraphHelperSize('#gyro', gyroHelpers);
samples_gyro_i = addSampleToData(gyro_data, samples_gyro_i, SENSOR_DATA.gyroscope); samples_gyro_i = addSampleToData(gyro_data, samples_gyro_i, SENSOR_DATA.gyroscope);
drawGraph(gyroHelpers, gyro_data, samples_gyro_i); drawGraph(gyroHelpers, gyro_data, samples_gyro_i);
raw_data_text_ements.x[0].text(SENSOR_DATA.gyroscope[0].toFixed(2)); raw_data_text_ements.x[0].text(SENSOR_DATA.gyroscope[0].toFixed(2));
@ -343,6 +350,8 @@ function tab_initialize_sensors() {
} }
if (checkboxes[1]) { if (checkboxes[1]) {
updateGraphHelperSize('#accel', accelHelpers);
samples_accel_i = addSampleToData(accel_data, samples_accel_i, SENSOR_DATA.accelerometer); samples_accel_i = addSampleToData(accel_data, samples_accel_i, SENSOR_DATA.accelerometer);
drawGraph(accelHelpers, accel_data, samples_accel_i); drawGraph(accelHelpers, accel_data, samples_accel_i);
raw_data_text_ements.x[1].text(SENSOR_DATA.accelerometer[0].toFixed(2)); raw_data_text_ements.x[1].text(SENSOR_DATA.accelerometer[0].toFixed(2));
@ -351,6 +360,8 @@ function tab_initialize_sensors() {
} }
if (checkboxes[2]) { if (checkboxes[2]) {
updateGraphHelperSize('#mag', magHelpers);
samples_mag_i = addSampleToData(mag_data, samples_mag_i, SENSOR_DATA.magnetometer); samples_mag_i = addSampleToData(mag_data, samples_mag_i, SENSOR_DATA.magnetometer);
drawGraph(magHelpers, mag_data, samples_mag_i); drawGraph(magHelpers, mag_data, samples_mag_i);
raw_data_text_ements.x[2].text(SENSOR_DATA.magnetometer[0].toFixed(2)); raw_data_text_ements.x[2].text(SENSOR_DATA.magnetometer[0].toFixed(2));
@ -360,6 +371,8 @@ function tab_initialize_sensors() {
} }
function update_altitude_graph() { function update_altitude_graph() {
updateGraphHelperSize('#baro', baroHelpers);
samples_baro_i = addSampleToData(baro_data, samples_baro_i, [SENSOR_DATA.altitude]); samples_baro_i = addSampleToData(baro_data, samples_baro_i, [SENSOR_DATA.altitude]);
drawGraph(baroHelpers, baro_data, samples_baro_i); drawGraph(baroHelpers, baro_data, samples_baro_i);
raw_data_text_ements.x[3].text(SENSOR_DATA.altitude.toFixed(2)); raw_data_text_ements.x[3].text(SENSOR_DATA.altitude.toFixed(2));
@ -367,6 +380,8 @@ function tab_initialize_sensors() {
function update_debug_graphs() { function update_debug_graphs() {
for (var i = 0; i < 4; i++) { for (var i = 0; i < 4; i++) {
updateGraphHelperSize(debugHelpers[i].selector, debugHelpers[i]);
addSampleToData(debug_data[i], samples_debug_i, [SENSOR_DATA.debug[i]]); addSampleToData(debug_data[i], samples_debug_i, [SENSOR_DATA.debug[i]]);
drawGraph(debugHelpers[i], debug_data[i], samples_debug_i); drawGraph(debugHelpers[i], debug_data[i], samples_debug_i);
raw_data_text_ements.x[4 + i].text(SENSOR_DATA.debug[i]); raw_data_text_ements.x[4 + i].text(SENSOR_DATA.debug[i]);