nmelone/www-POC
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Completes POCONSOLE-69. Adds gauge-off graphing. Also fixes Tag graphs to allow for showing/hiding tags

Browse Source
This commit is contained in:
Patrick McDonagh
2016-11-30 09:55:30 -06:00
parent 446162cfd4
commit 92ef84bc0b
5 changed files with 196 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/static/css/style.css
View File

@@ -0,0 +1,3 @@
.tagChart {
margin-bottom: 40px;
}

1
app/static/index.html
View File

@@ -10,6 +10,7 @@
<link rel="stylesheet" href="css/ng-quick-date.css">
<link rel="stylesheet" href="css/ng-quick-date-default-theme.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/style.css">
</head>

154
app/static/js/gaugeoff.controller.js
View File

@@ -1,6 +1,7 @@
poconsole.controller('gaugeOffCtrl',function($scope, Page, $q, $http) {
Page.setTitle('Gauge Off');
Page.setPage('gaugeoff');
var colors = ['#d7191c','#fdae61','#abdda4','#2b83ba'];
var getGaugeOffData = function(page_number){
var deferred = $q.defer();
$http.get('/api/gauge_off?q={"order_by":[{"field":"created_on","direction":"desc"}]}&page='+ page_number).success(function(data) {
@@ -22,6 +23,159 @@ poconsole.controller('gaugeOffCtrl',function($scope, Page, $q, $http) {
$scope.page_list = [];
$scope.page_num = d.page;
$scope.total = d.total;
var stroke_columns = [
{key: "downhole_gross_stroke_average", label: "DH Gross Stroke Avg"},
{key: "downhole_net_stroke_average", label: "DH Net Stroke Avg"},
{key: "surface_stroke_length_average", label: "Surface Stroke Avg"},
{key: "tubing_movement_average", label: "Tubing Movement Avg"}
];
var monetary_columns = [
{key: "electricity_cost_total", label: "Electricity Cost"},
{key: "lifting_cost_average", label: "Lifting Cost Avg"}
];
var energy_columns = [
{key: "kWh_used_total", label: "kWh Used"},
{key: "kWh_regen_total", label: "kWh Regen."}
];
var load_columns = [
{key: "min_pr_load", label: "Min. PR Load"},
{key: "peak_pr_load", label: "Peak PR Load"}
];
var other_columns = [
{key: "percent_run", label: "Percent Run"},
{key: "fluid_level_average", label: "Fluid Level Avg"},
{key: "inflow_rate_average", label: "Inflow Rate Avg"},
{key: "polished_rod_hp_average", label: "PR HP Avg"},
{key: "pump_hp_average", label: "Pump HP Avg"},
{key: "spm_average", label: "SPM Avg"}
];
$scope.stroke_options = {
series: [],
axes: {
x: {
key: "created_on",
type: "date"
}
}
};
$scope.monetary_options = {
series: [],
axes: {
x: {
key: "created_on",
type: "date"
}
}
};
$scope.energy_options = {
series: [],
axes: {
x: {
key: "created_on",
type: "date"
}
}
};
$scope.load_options = {
series: [],
axes: {
x: {
key: "created_on",
type: "date"
}
}
};
$scope.other_options = {
series: [],
axes: {
x: {
key: "created_on",
type: "date"
}
}
};
$scope.graphData = {};
$scope.graphData.go_data = d.objects;
for (var s_col in stroke_columns){
$scope.stroke_options.series.push(
{
axis: 'y',
dataset: 'go_data',
key: stroke_columns[s_col].key,
label: stroke_columns[s_col].label,
id: stroke_columns[s_col].key,
type: ['line'],
color: colors[s_col % colors.length],
drawDots:false
}
);
}
for (var m_col in monetary_columns){
$scope.monetary_options.series.push(
{
axis: 'y',
dataset: 'go_data',
key: monetary_columns[m_col].key,
label: monetary_columns[m_col].label,
id: monetary_columns[m_col].key,
type: ['line'],
color: colors[m_col % colors.length],
drawDots:false
}
);
}
for (var e_col in energy_columns){
$scope.energy_options.series.push(
{
axis: 'y',
dataset: 'go_data',
key: energy_columns[e_col].key,
label: energy_columns[e_col].label,
id: energy_columns[e_col].key,
type: ['line'],
color: colors[e_col % colors.length],
drawDots:false
}
);
}
for (var l_col in load_columns){
$scope.load_options.series.push(
{
axis: 'y',
dataset: 'go_data',
key: load_columns[l_col].key,
label: load_columns[l_col].label,
id: load_columns[l_col].key,
type: ['line'],
color: colors[l_col % colors.length],
drawDots:false
}
);
}
for (var o_col in other_columns){
$scope.other_options.series.push(
{
axis: 'y',
dataset: 'go_data',
key: other_columns[o_col].key,
label: other_columns[o_col].label,
id: other_columns[o_col].key,
type: ['line'],
color: colors[o_col % colors.length],
drawDots:false
}
);
}
});
};

2
app/static/js/tagVals.controller.js
View File

@@ -119,6 +119,7 @@ poconsole.controller('tagValsCtrl', function($scope, $route, $http, $routeParams
axis: "y",
dataset: "vals",
key: tagDefData[i2].name,
id: i2.toString(),
label: tagDefData[i2].name,
// color: "#1f77b4",
color: colors[i2 % colors.length],
@@ -126,6 +127,7 @@ poconsole.controller('tagValsCtrl', function($scope, $route, $http, $routeParams
drawDots:false
});
}
console.log($scope.options);
});
});
};

36
app/static/templates/gaugeOff.html
View File

@@ -51,4 +51,40 @@
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h1>Stroke Data</h1>
<div class="tagChart" style="height:400px;">
<linechart data="graphData" options="stroke_options"></linechart>
</div>
</div>
<div class="col-md-12">
<h1>Monetary Data</h1>
<div class="tagChart" style="height:400px;">
<linechart data="graphData" options="monetary_options"></linechart>
</div>
</div>
<div class="col-md-12">
<h1>Energy Data</h1>
<div class="tagChart" style="height:400px;">
<linechart data="graphData" options="energy_options"></linechart>
</div>
</div>
<div class="col-md-12">
<h1>Load Data</h1>
<div class="tagChart" style="height:400px;">
<linechart data="graphData" options="load_options"></linechart>
</div>
</div>
<div class="col-md-12">
<h1>Other Data</h1>
<div class="tagChart" style="height:400px;">
<linechart data="graphData" options="other_options"></linechart>
</div>
</div>
</div>
</div>