PID Tab cleanup

10.3.x-maintenance
skaman82 2016-06-30 11:49:43 +02:00
parent 50b46c3c97
commit ecfb1bcbca
3 changed files with 167 additions and 108 deletions

View File

@ -822,7 +822,7 @@
"message": "Please read receiver chapter of the documentation. Configure serial port (if required), receiver mode (serial/ppm/pwm), provider (for serial receivers), bind receiver, set channel map, configure channel endpoints/range on TX so that all channels go from ~1000 to ~2000. Set midpoint (default 1500), trim channels to 1500, configure stick deadband, verify behaviour when TX is off or out of range.<br /><span style=\"color: red\">IMPORTANT:</span> Before flying read failsafe chapter of documentation and configure failsafe." "message": "Please read receiver chapter of the documentation. Configure serial port (if required), receiver mode (serial/ppm/pwm), provider (for serial receivers), bind receiver, set channel map, configure channel endpoints/range on TX so that all channels go from ~1000 to ~2000. Set midpoint (default 1500), trim channels to 1500, configure stick deadband, verify behaviour when TX is off or out of range.<br /><span style=\"color: red\">IMPORTANT:</span> Before flying read failsafe chapter of documentation and configure failsafe."
}, },
"tuningHelp": { "tuningHelp": {
"message": "<b>Tuning tips</b><br><i>Derivative from Error</i> provides more direct stick response and is mostly prefered for Racing.<br><i>Derivative from Measurement</i> provides smoother stick response what is more usefull for freestyling<br><br /><span style=\"color: red\">IMPORTANT:</span> It is important to verify motor temperatures during first flights. The higher the filter value gets the better it may fly, but you do to get more noise into the motors. <br>Default value of 100hz is optimal, but for noiser setups you can try lowering Dterm filter to 50hz and possibly also the gyro filter." "message": "<b>Tuning tips</b><br /><span style=\"color: red\">IMPORTANT:</span> It is important to verify motor temperatures during first flights. The higher the filter value gets the better it may fly, but you do to get more noise into the motors. <br>Default value of 100hz is optimal, but for noiser setups you can try lowering Dterm filter to 50hz and possibly also the gyro filter."
}, },
"receiverThrottleMid": { "receiverThrottleMid": {
"message": "Throttle MID" "message": "Throttle MID"
@ -1674,6 +1674,13 @@
}, },
"configurationMagHardware": { "configurationMagHardware": {
"message": "Magnetometer (if supported)" "message": "Magnetometer (if supported)"
},
"PIDTip": {
"message": "<strong><i>Derivative from Error</i></strong> provides more direct stick response and is mostly prefered for Racing.<br><strong><i>Derivative from Measurement</i></strong> provides smoother stick response what is more usefull for freestyling"
} }
} }

View File

@ -29,6 +29,7 @@
.tab-pid_tuning .cf td:last-child { .tab-pid_tuning .cf td:last-child {
border-bottom-right-radius: 3px; border-bottom-right-radius: 3px;
border-right: 0px; border-right: 0px;
padding-bottom: 0px;
} }
.tab-pid_tuning .cf input { .tab-pid_tuning .cf input {
@ -52,7 +53,7 @@
.tab-pid_tuning .throttle_curve { .tab-pid_tuning .throttle_curve {
float: right; float: right;
width: calc(100% - 2px); /* - ( "virtual" margin) */ width: calc(100% - 2px); /* - ( "virtual" margin) */
margin: 0 0px 0px 0; margin: 0 2px 0px 0;
border: 1px solid silver; border: 1px solid silver;
border-radius: 3px; border-radius: 3px;
background-image: url(../images/paper.jpg); background-image: url(../images/paper.jpg);
@ -201,8 +202,7 @@
} }
.tab-pid_tuning .pitch_roll_curve { .tab-pid_tuning .pitch_roll_curve {
margin: 0 0px 0px 0; margin: 0 4px 0px 0;
width: 100%;
height: 100%; height: 100%;
border: 1px solid silver; border: 1px solid silver;
border-radius: 3px; border-radius: 3px;
@ -235,8 +235,7 @@
} }
.tab-pid_tuning .yaw_curve { .tab-pid_tuning .yaw_curve {
margin: 0 0px 0px 0; margin: 0 4px 0px 0;
width: 100%;
height: 100%; height: 100%;
border: 1px solid silver; border: 1px solid silver;
border-radius: 3px; border-radius: 3px;
@ -318,8 +317,9 @@
} }
.tab-pid_tuning .single-field { .tab-pid_tuning .single-field {
display: inline-block; display: inline-block;
margin-bottom: 10px; margin-bottom: 10px;
margin-right: 5px;
} }
.tab-pid_tuning .single-field .head { .tab-pid_tuning .single-field .head {
@ -415,6 +415,13 @@
background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 10%, transparent 10%, transparent 20%, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .2) 30%, transparent 30%, transparent 40%, rgba(255, 255, 255, .2) 40%, rgba(255, 255, 255, .2) 50%, transparent 50%, transparent 60%, rgba(255, 255, 255, .2) 60%, rgba(255, 255, 255, .2) 70%, transparent 70%, transparent 80%, rgba(255, 255, 255, .2) 80%, rgba(255, 255, 255, .2) 90%, transparent 90%, transparent 100%, rgba(255, 255, 255, .2) 100%, transparent); background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 10%, transparent 10%, transparent 20%, rgba(255, 255, 255, .2) 20%, rgba(255, 255, 255, .2) 30%, transparent 30%, transparent 40%, rgba(255, 255, 255, .2) 40%, rgba(255, 255, 255, .2) 50%, transparent 50%, transparent 60%, rgba(255, 255, 255, .2) 60%, rgba(255, 255, 255, .2) 70%, transparent 70%, transparent 80%, rgba(255, 255, 255, .2) 80%, rgba(255, 255, 255, .2) 90%, transparent 90%, transparent 100%, rgba(255, 255, 255, .2) 100%, transparent);
} }
.fancy.header th {
padding-bottom: 4px;
padding-top: 4px;
padding-left: 5px;
}
.pid_mode { .pid_mode {
width: calc(100% - 5px); width: calc(100% - 5px);
height: 20px; height: 20px;
@ -566,6 +573,41 @@
margin-top:15px; margin-top:15px;
} }
.tab-pid_tuning .bottomarea {
float: left;
width: calc(100% - 2px);
border-bottom: 1px solid silver;
border-left: 1px solid silver;
border-right: 1px solid silver;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
padding-top: 5px;
padding-bottom: 5px;
}
.tab-pid_tuning .controller {
width: 100px;
}
.tab-pid_tuning .controller select {
border: 1px solid silver;
margin-left: 5px;
width: calc(100% - 10px);
}
.tab-pid_tuning .delta {
width: 150px;
}
.tab-pid_tuning .delta select {
border: 1px solid silver;
margin-left: 5px;
width: calc(100% - 10px);
}
.tab-pid_tuning .bracket { .tab-pid_tuning .bracket {
position: absolute; position: absolute;
background-image: url(/images/icons/icon_bracket.svg); background-image: url(/images/icons/icon_bracket.svg);
@ -592,4 +634,9 @@
background-image: url(../images/paper.jpg); background-image: url(../images/paper.jpg);
background-size: 100%; background-size: 100%;
background-position: center; background-position: center;
border: 1px solid silver;
margin-top: -1px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
height: 260px;
} }

View File

@ -4,24 +4,29 @@
<div class="cf_doc_version_bt"> <div class="cf_doc_version_bt">
<a id="button-documentation" href="https://github.com/betaflight/betaflight/releases" target="_blank"></a> <a id="button-documentation" href="https://github.com/betaflight/betaflight/releases" target="_blank"></a>
</div> </div>
<div class="note"> <div class="note" style="margin-bottom: 25px;">
<div class="note_spacer"> <div class="note_spacer">
<p i18n="tuningHelp"></p> <p i18n="tuningHelp"></p>
</div> </div>
</div> </div>
<div class="cf_column twothird"> <div class="cf_column twothird">
<div class="controller single-field"> <div class="controller single-field">
<div class="head" i18n="pidTuningControllerHead"></div> <div class="head" i18n="pidTuningControllerHead"></div>
<select name="controller"> <div class="bottomarea">
<!-- list generated here --> <select name="controller">
</select> <!-- list generated here -->
</select>
</div>
</div> </div>
<div class="delta single-field"> <div class="delta single-field">
<div class="helpicon cf_tip" i18n_title="PIDTip" style="margin-top: 5px;"></div>
<div class="head">Derivative Method</div> <div class="head">Derivative Method</div>
<select name="delta"> <div class="bottomarea">
<option value="0">Error</option> <select name="delta">
<option value="1">Measurement</option> <option value="0">Error</option>
</select> <option value="1">Measurement</option>
</select>
</div>
</div> </div>
<div class="cf_column right"> <div class="cf_column right">
<div class="default_btn show"> <div class="default_btn show">
@ -30,8 +35,6 @@
<div class="default_btn resetbt"> <div class="default_btn resetbt">
<a href="#" id="resetPIDs">Reset PID Controller</a> <a href="#" id="resetPIDs">Reset PID Controller</a>
</div> </div>
</div> </div>
</div> </div>
<form name="pid-tuning" id="pid-tuning"> <form name="pid-tuning" id="pid-tuning">
@ -44,9 +47,9 @@
<th class="proportional" i18n="pidTuningProportional"></th> <th class="proportional" i18n="pidTuningProportional"></th>
<th class="integral" i18n="pidTuningIntegral"></th> <th class="integral" i18n="pidTuningIntegral"></th>
<th class="derivative" i18n="pidTuningDerivative"></th> <th class="derivative" i18n="pidTuningDerivative"></th>
<th class="rc_rate" i18n="pidTuningRcRate"></th> <th class="rc_rate" i18n="pidTuningRcRate"></th>
<th class="rate" i18n="pidTuningRate"></th> <th class="rate" i18n="pidTuningRate"></th>
<th class="rc_expo" i18n="pidTuningRcExpo"></th> <th class="rc_expo" i18n="pidTuningRcExpo"></th>
</tr> </tr>
</table> </table>
<table id="pid_main" class="pid_tuning"> <table id="pid_main" class="pid_tuning">
@ -61,11 +64,16 @@
<td><input type="number" name="p" step="1" min="0" max="255" /></td> <td><input type="number" name="p" step="1" min="0" max="255" /></td>
<td><input type="number" name="i" step="1" min="0" max="255" /></td> <td><input type="number" name="i" step="1" min="0" max="255" /></td>
<td><input type="number" name="d" step="1" min="0" max="255" /></td> <td><input type="number" name="d" step="1" min="0" max="255" /></td>
<td rowspan="2" style="background-color:white;"><input type="number" name="rc_rate" step="0.01" min="0" max="2.5" /><div class="bracket"></div></td> <td rowspan="2" style="background-color:white;">
<td class="roll_rate"><input type="number" name="roll_rate" step="0.01" min="0" max="1.00" /></td> <input type="number" name="rc_rate" step="0.01" min="0" max="2.5" />
<td class="roll_pitch_rate" rowspan="2"><input type="number" name="roll_pitch_rate" step="0.01" min="0" max="1.00" /></td> <div class="bracket"></div>
<td rowspan="2" style="background-color:white;"><input type="number" name="rc_expo" step="0.01" min="0" max="1" /><div class="bracket"></div></td> </td>
<td class="roll_rate"><input type="number" name="roll_rate" step="0.01" min="0" max="1.00" /></td>
<td class="roll_pitch_rate" rowspan="2"><input type="number" name="roll_pitch_rate" step="0.01" min="0" max="1.00" /></td>
<td rowspan="2" style="background-color:white;">
<input type="number" name="rc_expo" step="0.01" min="0" max="1" />
<div class="bracket"></div>
</td>
</tr> </tr>
<tr class="PITCH"> <tr class="PITCH">
<!-- 1 --> <!-- 1 -->
@ -81,12 +89,12 @@
<td><input type="number" name="p" step="1" min="0" max="255" /></td> <td><input type="number" name="p" step="1" min="0" max="255" /></td>
<td><input type="number" name="i" step="1" min="0" max="255" /></td> <td><input type="number" name="i" step="1" min="0" max="255" /></td>
<td><input type="number" name="d" step="1" min="0" max="255" /></td> <td><input type="number" name="d" step="1" min="0" max="255" /></td>
<td rowspan="1"><input type="number" name="rc_rate_yaw" step="0.01" min="0" max="2.5" /></td> <td rowspan="1"><input type="number" name="rc_rate_yaw" step="0.01" min="0" max="2.5" /></td>
<td><input type="number" name="yaw_rate" step="0.01" min="0" max="2.55" /></td> <td><input type="number" name="yaw_rate" step="0.01" min="0" max="2.55" /></td>
<td><input type="number" name="rc_yaw_expo" step="0.01" min="0" max="1" /></td> <td><input type="number" name="rc_yaw_expo" step="0.01" min="0" max="1" /></td>
</tr> </tr>
</table> </table>
</div> </div>
<div class="gui_box grey topspacer"> <div class="gui_box grey topspacer">
<table class="pid_titlebar"> <table class="pid_titlebar">
<tr> <tr>
@ -161,7 +169,6 @@
</tr> </tr>
</table> </table>
</div> </div>
<div class="gui_box grey topspacer"> <div class="gui_box grey topspacer">
<table id="pid_accel" class="pid_tuning"> <table id="pid_accel" class="pid_tuning">
<tr class="fancy header"> <tr class="fancy header">
@ -182,7 +189,6 @@
</tr> </tr>
</table> </table>
</div> </div>
<div class="gui_box grey topspacer"> <div class="gui_box grey topspacer">
<table class="pid_filter" class="pid_tuning"> <table class="pid_filter" class="pid_tuning">
<tr class="fancy header"> <tr class="fancy header">
@ -199,91 +205,90 @@
</tr> </tr>
</table> </table>
</div> </div>
<div class="cf_column half topspacer"> <div class="cf_column half topspacer">
<div> <div>
<table class="rc_curve cf"> <table class="rc_curve cf">
<thead> <thead>
<tr> <tr>
<th i18n="rcCurve"></th> <th i18n="rcCurve"></th>
</tr> </tr>
</thead> </thead>
</tbody> </tbody>
<tr>
<td>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="pitch_roll_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div class="clear-both"></div>
</div>
<div class="topspacer">
<table class="rc_yaw_curve cf">
<thead>
<tr>
<th i18n="rcYawCurve"></th>
</tr>
</thead>
</tbody>
<tr>
<td>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="yaw_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div class="clear-both"></div>
</div>
</div>
<div class="cf_column half topspacer">
<table class="tpa cf">
<thead>
<tr> <tr>
<th i18n="pidTuningRatesPreview"></th> <td>
</tr> <div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
</thead> <div class="pitch_roll_curve">
<tbody> <canvas height="120px" style="width: 100%; height: 100%"></canvas>
<tr> </div>
<td class="rates_preview_cell">
<div class="rates_preview">
<canvas id="canvas"></canvas>
</div> </div>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div class="clear-both"></div>
</div>
<div class="topspacer">
<table class="rc_yaw_curve cf">
<thead>
<tr>
<th i18n="rcYawCurve"></th>
</tr>
</thead>
</tbody>
<tr>
<td>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="yaw_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div class="clear-both"></div>
</div>
</div>
<div class="cf_column half topspacer">
<div class="spacer_left">
<table class="tpa cf">
<thead>
<tr>
<th i18n="pidTuningRatesPreview" style="font-weight: bold;"></th>
</tr>
</thead>
<tbody>
<tr>
<td class="rates_preview_cell">
<div class="rates_preview">
<canvas id="canvas"></canvas>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div> </div>
</div> </div>
<div class="cf_column third_right"> <div class="cf_column third_right">
<div class="spacer_left throttle"> <div class="spacer_left throttle">
<table class="cf"> <table class="cf">
<thead> <thead>
<tr> <tr>
<th colspan=2 i18n="throttle"></th> <th colspan=2 i18n="throttle"></th>
</tr> </tr>
</thead> </thead>
</tbody> </tbody>
<tr> <tr>
<td colspan=2> <td colspan=2>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;"> <div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="throttle_curve"> <div class="throttle_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas> <canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div>
</div> </div>
</td> </div>
</tr> </td>
</tbody> </tr>
</tbody>
</table> </table>
</div> </div>
<div class="spacer_left topspacer"> <div class="spacer_left topspacer">
@ -310,7 +315,7 @@
<th class="tpa-breakpoint" i18n="pidTuningTPABreakPoint"></th> <th class="tpa-breakpoint" i18n="pidTuningTPABreakPoint"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td class="leftzero"><input type="number" name="tpa" step="0.01" min="0" <td class="leftzero"><input type="number" name="tpa" step="0.01" min="0"
max="1.00" /></td> max="1.00" /></td>