Skip to content

Commit

Permalink
Pdf fixes and other recent issues (#73)
Browse files Browse the repository at this point in the history
* min width in tour template

* slide changes Jon requested

* updated sample data

* removed header for sample data, so it can be imported quickly

* fixed tooltip for rating error rounding incorrectly

* added bold line in error plot to clearly show optimization target

* made compare curve input smaller

* added notes and more info by Jons request

* hope to fix problem of 0 Q from autofit. needs testing

* increased sig figs on tooltip

* auto formatting and fixing PDF plots

* unabbridged equation in pdf
  • Loading branch information
tobiasmllr authored Mar 8, 2024
1 parent 7b959e5 commit 0eeaafe
Show file tree
Hide file tree
Showing 16 changed files with 336 additions and 275 deletions.
20 changes: 0 additions & 20 deletions HydRA Test Curves_20240115/RC_LCR2122.csv

This file was deleted.

6 changes: 0 additions & 6 deletions HydRA Test Curves_20240115/RC_Lizard.csv

This file was deleted.

20 changes: 0 additions & 20 deletions HydRA Test Curves_20240115/RC_cook1.csv

This file was deleted.

10 changes: 0 additions & 10 deletions HydRA Test Curves_20240115/RC_cook2.csv

This file was deleted.

24 changes: 0 additions & 24 deletions HydRA Test Curves_20240115/RC_grand.csv

This file was deleted.

22 changes: 0 additions & 22 deletions HydRA Test Curves_20240115/RC_random.csv

This file was deleted.

11 changes: 0 additions & 11 deletions HydRA Test Curves_20240115/RC_shelly.csv

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@
<th class="table-cell">coefficient</th>
<th class="table-cell">exponent</th>
<th class="table-cell">offset</th>
<th class="table-cell">start point</th>
<th class="table-cell">end point</th>
<th class="table-cell">start point<br>(stage in m)</th>
<th class="table-cell">end point<br>(stage in m)</th>
<th class="table-cell">RMSE</th>
<th class="table-cell"><p id="comparison-header", style="color:#9ec1a3">compare</p></th>
</tr>
Expand Down Expand Up @@ -40,32 +40,52 @@
{% endif %}
<tr class="table-row" id="add-compare">
<td class="table-cell">
<input type="text" class="form-control form-control-sm" name="compareLabel" id="compareLabel" style="font-size: 12px; min-width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" class="form-control form-control-sm" name="compareLabel" id="compareLabel" style="font-size: 12px; min-width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<input type="number" step="0.01" class="form-control form-control-sm" name="compareConst" id="compareConst" style="font-size: 12px; width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" inputmode="numeric" step="0.01" class="form-control form-control-sm" name="compareConst" id="compareConst" style="font-size: 12px; width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<input type="number" step="0.01" class="form-control form-control-sm" name="compareExp" id="compareExp" style="font-size: 12px; width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" inputmode="numeric" step="0.01" class="form-control form-control-sm" name="compareExp" id="compareExp" style="font-size: 12px; width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<input type="number" step="0.01" class="form-control form-control-sm" name="compareOffset" id="compareOffset" style="font-size: 12px; width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" inputmode="numeric" step="0.01" class="form-control form-control-sm" name="compareOffset" id="compareOffset" style="font-size: 12px; width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<input type="number" step="0.01" class="form-control form-control-sm" name="compareStartBounds" id="compareStartBounds" style="font-size: 12px; width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" inputmode="numeric" step="0.01" class="form-control form-control-sm" name="compareStartBounds" id="compareStartBounds" style="font-size: 12px; width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<input type="number" step="0.01" class="form-control form-control-sm" name="compareEndBounds" id="compareEndBounds" style="font-size: 12px; width: 40px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
<input type="text" inputmode="numeric" step="0.01" class="form-control form-control-sm" name="compareEndBounds" id="compareEndBounds" style="font-size: 12px; width: 45px" placeholder="" onchange="" onkeydown="return event.key != 'Enter';">
</td>
<td class="table-cell">
<p id="compare-curve-rmse" style="width: 40px;"></p>
<p id="compare-curve-rmse" style="width: 45px;"></p>
</td>
<td class="table-cell" style="display:block">
<div id="add-curve">
<button class="btn btn-success btn-sm" type="submit" href="#" onclick="addCompareCurve()" style="background-color: #9ec1a3 !important; border-color: #FFFFFF; width: 40px;" onkeydown="return event.key != 'Enter';"> + </button>
<button
class="btn btn-success btn-sm"
type="submit"
href="#"
onclick="addCompareCurve()"
style="background-color: #9ec1a3 !important; border-color: #FFFFFF; width: 45px;"
onkeydown="return event.key != 'Enter';"
data-toggle="tooltip"
data-placement="top"
title="Input rating equation parameters to compare rating curves"
> + </button>
</div>
<div id="remove-curve" style="display:none">
<button class="btn btn-success btn-sm" type="submit" href="#" onclick="removeCompareCurve()" style="background-color: #CC6677 !important; border-color: #FFFFFF; width: 40px;" onkeydown="return event.key != 'Enter';"> - </button>
<button
class="btn btn-success btn-sm"
type="submit"
href="#"
onclick="removeCompareCurve()"
style="background-color: #CC6677 !important; border-color: #FFFFFF; width: 45px;"
onkeydown="return event.key != 'Enter';"
data-toggle="tooltip"
data-placement="top"
title="Remove rating curve from chart"
> - </button>
</div>
</td>
</tr>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,9 @@ <h6 class="card-header text-center" style="background-color: #758fa8; color: #FF
backdrop: true,
delay: 750,
backdropPadding: 10,
placement: "auto",
smartPlacement: true,
template: "<div class='popover tour'><div class='arrow'></div><h3 class='popover-title'></h3><div class='popover-content' style='min-width: 250px'></div><div class='popover-navigation'><button class='btn btn-default' data-role='prev'>« Prev</button><span data-role='separator'>|</span><button class='btn btn-default' data-role='next'>Next »</button><button class='btn btn-default' data-role='end'>End tour</button></div></div>",
onEnd: function (tour) {
sessionStorage.setItem("tourStatus", false);
$('#tour_request_status_id').val("1")
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -215,6 +215,13 @@
rcDict = {'data':rcData, 'parameters':rcParam};

// 3.5 Update HTML equation parameters and user input fields
// make sure all bounds for Q are at minimum 0.001:
if (rcParam[0].seg_bounds[0][1] < 0.001) {
rcParam[0].seg_bounds[0][1] = 0.001;
}
if (rcParam[0].seg_bounds[1][1] < 0.001) {
rcParam[0].seg_bounds[1][1] = 0.001;
}
var segNumStr = String(idx + 1);
document.getElementById('segment' + segNumStr + '-const').innerHTML = C.toFixed(2);
document.getElementById('segment' + segNumStr + '-exp').innerHTML = slope.toFixed(2);
Expand Down Expand Up @@ -501,7 +508,6 @@
----------------------------------------------------------------------------------------------------------------------------------------------*/

function setEndpoints(segEP, pointEP, coordEP, valueEP) {

// 1. COLLECT AND INITIATE PARAMETERS
if (rcParam.length == 2) {
var newSegBounds = [rcParam[0].seg_bounds, rcParam[1].seg_bounds];
Expand Down Expand Up @@ -1289,12 +1295,12 @@
}
}
}
label.push(['H: ' + h_field.toFixed(2) + ' m']);
label.push(['Q: ' + q_field.toFixed(2) + ' m³/s']);
label.push(['H: ' + h_field.toFixed(3) + ' m']);
label.push(['Q: ' + q_field.toFixed(3) + ' m³/s']);
label.push(['date: ' + fielddatacsv.datetime[idx]]);
if (h_model !== null) {
label.push(['H shift: ' + (h_model - h_field).toFixed(2) + ' m'])
label.push(['H shift: ' + (h_model - h_field).toFixed(2) + ' m'])
label.push(['H shift: ' + (h_model - h_field).toFixed(3) + ' m'])
label.push(['H shift: ' + (h_model - h_field).toFixed(3) + ' m'])
}
//if (q_model !== null){
// label.push(['Q model: ' + q_model.toFixed(2) + ' m³/s']);
Expand Down Expand Up @@ -1457,14 +1463,20 @@
display: true,
text: 'Q rated vs Q field (% change)'
},
beginAtZero: false
beginAtZero: true,
// make zero tick thicker:
grid: {
color: function(context) {
return context.tick.value === 0 ? 'black' : 'rgba(0,0,0,0.1)';
},
},
},
y: {
title: {
display: true,
text: 'Stage H (m)'
},
beginAtZero: false
beginAtZero: false,
}

},
Expand Down Expand Up @@ -1502,21 +1514,17 @@
let q_model = calc_q_model(h_field, rcParam[seg].const, rcParam[seg].exp, rcParam[seg].offset)
// r_percent = 100 * (q_field - q_model) / q_field
let q_field = - 100 * q_model / (r_percent - 100)
let q_field_rounded = Math.round(q_field * 100) / 100
let q_field_rounded = Math.round(q_field * 1000) / 1000
let h_model = calc_h_model(q_field, rcParam[seg].const, rcParam[seg].exp, rcParam[seg].offset)
let r_volumetric = r_percent/100 * q_field

for (var idx in fielddatacsv.stage) {
if (fielddatacsv.stage[idx] == h_field && fielddatacsv.discharge[idx] == q_field_rounded) {
label.push(['H: ' + h_field.toFixed(2) + ' m']);
label.push(['Q: ' + q_field.toFixed(2) + ' m³/s']);
label.push(['H: ' + h_field.toFixed(3) + ' m']);
label.push(['Q: ' + q_field.toFixed(3) + ' m³/s']);
label.push(['date: ' + fielddatacsv.datetime[idx]]);
if (h_model !== null) {
label.push(['H shift: ' + (h_model - h_field).toFixed(2) + ' m'])
label.push(['H shift: ' + (h_model - h_field).toFixed(3) + ' m'])
}
//if (q_model !== null){
// label.push(['Q model: ' + q_model.toFixed(2) + ' m³/s']);
//}
if (r_percent !== null){
if (r_percent > 0){
// show + sign for positive values
Expand All @@ -1527,6 +1535,7 @@
label.push(['R volume:' + r_volumetric.toFixed(2) + ' m3/s']);
}
}
break;
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,8 @@
<div class="card">
<h6 class="card-header text-center" style="background-color: #758fa8; color: #FFFFFF; height:30px; font-size:12.5px; padding-top:7px;">Export</h6>
<div class="card-body pt-3" style="margin: auto;">
<div syle="flex: 1">
<div style="col-xl-4 col-lg-6 col-md-6 col-sm-12">
<p style="font-size:11.5px;">Note: The rating curve generated by HydRA produces an equation ONLY. All input (stage) and output (discharge) datasets including any discrete measurements of stage and discharge must be reviewed and graded according to the provincial hydrometric RISC standards. </p>
<form method="post" id="export-form" action="./output" target="_blank">
<div class="form-group">
{% csrf_token %}
Expand Down
Loading

0 comments on commit 0eeaafe

Please sign in to comment.