completamento visualizzaizone chartjs in smart/commesse
This commit is contained in:
Samuele E. Locatelli
@@ -1 +1,166 @@
|
||||
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="cmp_chart.ascx.cs" Inherits="GPW_Commesse.WebUserControls.cmp_chart" %>
|
||||
<%--https://www.chartjs.org/--%>
|
||||
|
||||
<asp:HiddenField runat="server" ID="hfIdxDip" />
|
||||
<asp:HiddenField runat="server" ID="hfData" />
|
||||
<canvas id="myChartTS" width="300" height="120"></canvas>
|
||||
<div class="row">
|
||||
<div class="col-6 text-right">Periodo</div>
|
||||
<div class="col-6">
|
||||
<asp:DropDownList runat="server" ID="ddlMaxNum" AutoPostBack="true">
|
||||
<asp:ListItem Text="1 mese" Value="30"></asp:ListItem>
|
||||
<asp:ListItem Text="2 mesi" Value="60"></asp:ListItem>
|
||||
<asp:ListItem Text="3 mesi" Value="90"></asp:ListItem>
|
||||
<asp:ListItem Text="6 mesi" Value="180"></asp:ListItem>
|
||||
<asp:ListItem Text="1 anno" Value="366"></asp:ListItem>
|
||||
<asp:ListItem Text="Tutto" Value="0"></asp:ListItem>
|
||||
</asp:DropDownList>
|
||||
</div>
|
||||
</div>
|
||||
<canvas id="myChartHist" width="300" height="120"></canvas>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
//var prm = Sys.WebForms.PageRequestManager.getInstance();
|
||||
//prm.add_pageLoaded(pageLoaded);
|
||||
|
||||
//function pageLoaded(sender, args) {
|
||||
// console.log('pageLoaded!');
|
||||
// // chiamo recupero dati + plot della TS e dell'Histogram
|
||||
// plotTS();
|
||||
// plotHist();
|
||||
//}
|
||||
|
||||
// funzione eseguita se successo al caricamento
|
||||
function OnSuccess_(reponse) {
|
||||
|
||||
// recupero dati restituiti
|
||||
var dataTS = reponse;
|
||||
//console.log('Recieved our data', dataTS);
|
||||
|
||||
var myOptions = {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
//type: 'linear',
|
||||
display: true,
|
||||
ticks: {
|
||||
maxTicksLimit: 10,
|
||||
}
|
||||
}],
|
||||
xAxes: [{
|
||||
type: 'time',
|
||||
distribution: 'linear',
|
||||
}]
|
||||
}
|
||||
, animation: {
|
||||
duration: 100
|
||||
},
|
||||
};
|
||||
|
||||
// recupero obj chart
|
||||
var ctx = document.getElementById('myChartTS').getContext('2d');
|
||||
var chart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
datasets: [{
|
||||
borderColor: 'rgb(7, 173, 236)',
|
||||
lineTension: 0,
|
||||
steppedLine: true,
|
||||
label: 'Temperatura Rilevata',
|
||||
data: dataTS
|
||||
}]
|
||||
},
|
||||
options: myOptions
|
||||
});
|
||||
|
||||
}
|
||||
// errore in reload!
|
||||
function OnErrorCall_(repo) {
|
||||
alert("Errore recupero dati grafico!");
|
||||
}
|
||||
// funzione eseguita se successo al caricamento
|
||||
function HistOnSuccess_(reponse) {
|
||||
// recupero dati restituiti
|
||||
var dataHist = reponse;
|
||||
//console.log('Recieved our data', dataHist);
|
||||
|
||||
// opzioni
|
||||
var myOptions = {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
//type: 'linear',
|
||||
display: true,
|
||||
ticks: {
|
||||
beginAtZero: true,
|
||||
maxTicksLimit: 10,
|
||||
}
|
||||
}]
|
||||
},
|
||||
animation: {
|
||||
duration: 300
|
||||
},
|
||||
};
|
||||
|
||||
// converto i valori etichette/freq
|
||||
var barVal = [], barLabels = [];
|
||||
dataHist.forEach(function (entry) {
|
||||
barVal.push(entry.y);
|
||||
barLabels.push(entry.x);
|
||||
});
|
||||
//console.log('labels: ', barLabels);
|
||||
//console.log('bars: ', barVal);
|
||||
|
||||
// recupero obj chart
|
||||
var ctx = document.getElementById('myChartHist').getContext('2d');
|
||||
var chart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: barLabels,
|
||||
datasets: [{
|
||||
label: 'Freq. Osservate',
|
||||
backgroundColor: 'rgb(7, 173, 236)',
|
||||
data: barVal
|
||||
}]
|
||||
},
|
||||
options: myOptions
|
||||
});
|
||||
|
||||
}
|
||||
// errore in reload!
|
||||
function HistOnErrorCall_(repo) {
|
||||
alert("Errore recupero dati grafico HIST!");
|
||||
}
|
||||
// effettuo plotting grafico TimeSerie!
|
||||
function plotTS() {
|
||||
// caricamento pagina
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "api/TempRil/<%=hfIdxDip.Value %>?date=<%=hfData.Value%>&numRec=<%=ddlMaxNum.SelectedValue%>",
|
||||
contentType: "application/json; charset=utf-8",
|
||||
dataType: "json",
|
||||
success: OnSuccess_,
|
||||
error: OnErrorCall_
|
||||
});
|
||||
}
|
||||
// effettuo plotting grafico Hist!
|
||||
function plotHist() {
|
||||
// caricamento pagina
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "api/TempHist/<%=hfIdxDip.Value %>?date=<%=hfData.Value%>&numRec=<%=ddlMaxNum.SelectedValue%>",
|
||||
contentType: "application/json; charset=utf-8",
|
||||
dataType: "json",
|
||||
success: HistOnSuccess_,
|
||||
error: HistOnErrorCall_
|
||||
});
|
||||
}
|
||||
|
||||
// funzione di drawing ad OGNI pageload!
|
||||
function pageLoad() {
|
||||
//console.log('pageLoad!');
|
||||
// chiamo recupero dati + plot della TS e dell'Histogram
|
||||
plotTS();
|
||||
plotHist();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
using System;
|
||||
using GPW_data;
|
||||
using SteamWare;
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Web;
|
||||
@@ -7,11 +9,29 @@ using System.Web.UI.WebControls;
|
||||
|
||||
namespace GPW_Commesse.WebUserControls
|
||||
{
|
||||
public partial class cmp_chart : System.Web.UI.UserControl
|
||||
public partial class cmp_chart : BaseUserControl
|
||||
{
|
||||
|
||||
public DateTime dtRif
|
||||
{
|
||||
get
|
||||
{
|
||||
|
||||
DateTime answ = DateTime.Today;
|
||||
DateTime.TryParse(hfData.Value, out answ);
|
||||
return answ;
|
||||
}
|
||||
set
|
||||
{
|
||||
hfData.Value = value.ToString("yyyy-MM-dd");
|
||||
ddlMaxNum.DataBind();
|
||||
}
|
||||
}
|
||||
|
||||
protected void Page_Load(object sender, EventArgs e)
|
||||
{
|
||||
|
||||
// imposto valori...
|
||||
hfIdxDip.Value = $"{DataProxy.idxDipendente}";
|
||||
}
|
||||
}
|
||||
}
|
||||
+30
-3
@@ -1,10 +1,10 @@
|
||||
//------------------------------------------------------------------------------
|
||||
// <auto-generated>
|
||||
// <generato automaticamente>
|
||||
// Codice generato da uno strumento.
|
||||
//
|
||||
// Le modifiche a questo file possono causare un comportamento non corretto e verranno perse se
|
||||
// il codice viene rigenerato.
|
||||
// </auto-generated>
|
||||
// il codice viene rigenerato.
|
||||
// </generato automaticamente>
|
||||
//------------------------------------------------------------------------------
|
||||
|
||||
namespace GPW_Commesse.WebUserControls
|
||||
@@ -13,5 +13,32 @@ namespace GPW_Commesse.WebUserControls
|
||||
|
||||
public partial class cmp_chart
|
||||
{
|
||||
|
||||
/// <summary>
|
||||
/// Controllo hfIdxDip.
|
||||
/// </summary>
|
||||
/// <remarks>
|
||||
/// Campo generato automaticamente.
|
||||
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
|
||||
/// </remarks>
|
||||
protected global::System.Web.UI.WebControls.HiddenField hfIdxDip;
|
||||
|
||||
/// <summary>
|
||||
/// Controllo hfData.
|
||||
/// </summary>
|
||||
/// <remarks>
|
||||
/// Campo generato automaticamente.
|
||||
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
|
||||
/// </remarks>
|
||||
protected global::System.Web.UI.WebControls.HiddenField hfData;
|
||||
|
||||
/// <summary>
|
||||
/// Controllo ddlMaxNum.
|
||||
/// </summary>
|
||||
/// <remarks>
|
||||
/// Campo generato automaticamente.
|
||||
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
|
||||
/// </remarks>
|
||||
protected global::System.Web.UI.WebControls.DropDownList ddlMaxNum;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,12 +1,14 @@
|
||||
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="mod_commUtLog.ascx.cs" Inherits="GPW_Commesse.WebUserControls.mod_commUtLog" %>
|
||||
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
|
||||
<%@ Register Src="mod_periodoAnalisi.ascx" TagName="mod_periodoAnalisi" TagPrefix="uc2" %>
|
||||
<%@ Register Src="mod_commAttivitaDesk.ascx" TagName="mod_commAttivitaDesk" TagPrefix="uc3" %>
|
||||
<%@ Register Src="mod_commUtMancTimbr.ascx" TagName="mod_commUtMancTimbr" TagPrefix="uc4" %>
|
||||
<%@ Register Src="mod_elencoTimbr.ascx" TagName="mod_elencoTimbr" TagPrefix="uc5" %>
|
||||
<%@ Register Src="mod_TagCloudProgetti.ascx" TagName="mod_TagCloudProgetti" TagPrefix="uc6" %>
|
||||
<%@ Register Src="~/WebUserControls/mod_periodoAnalisi.ascx" TagName="mod_periodoAnalisi" TagPrefix="uc2" %>
|
||||
<%@ Register Src="~/WebUserControls/mod_commAttivitaDesk.ascx" TagName="mod_commAttivitaDesk" TagPrefix="uc3" %>
|
||||
<%@ Register Src="~/WebUserControls/mod_commUtMancTimbr.ascx" TagName="mod_commUtMancTimbr" TagPrefix="uc4" %>
|
||||
<%@ Register Src="~/WebUserControls/mod_elencoTimbr.ascx" TagName="mod_elencoTimbr" TagPrefix="uc5" %>
|
||||
<%@ Register Src="~/WebUserControls/mod_TagCloudProgetti.ascx" TagName="mod_TagCloudProgetti" TagPrefix="uc6" %>
|
||||
<%@ Register Src="~/WebUserControls/cmp_toggle.ascx" TagPrefix="uc2" TagName="cmp_toggle" %>
|
||||
<%@ Register Src="~/WebUserControls/cmp_rilTemp.ascx" TagPrefix="uc2" TagName="cmp_rilTemp" %>
|
||||
<%@ Register Src="~/WebUserControls/cmp_chart.ascx" TagPrefix="uc2" TagName="cmp_chart" %>
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -30,6 +32,7 @@
|
||||
<div runat="server" id="divSx" visible="false">
|
||||
<asp:Panel ID="pnlEditTemp" runat="server" Height="100%" Visible="false" CssClass="table-secondary">
|
||||
<uc2:cmp_rilTemp runat="server" ID="cmp_rilTemp" />
|
||||
<uc2:cmp_chart runat="server" ID="cmp_chart" />
|
||||
</asp:Panel>
|
||||
<asp:Panel ID="pnlEditOre" runat="server" Height="100%" Visible="false" CssClass="table-secondary">
|
||||
<div class="blockSpac">
|
||||
@@ -81,9 +84,16 @@
|
||||
<ItemTemplate>
|
||||
<div class="text-center">
|
||||
<asp:LinkButton runat="server" ID="lbShowTemp" CausesValidation="False" CommandName="Select" CommandArgument='<%# Eval("Data") %>' CssClass="btn btn-outline-secondary btn-sm" OnClick="lbShowTemp_Click">
|
||||
|
||||
<i runat="server" visible='<%# !gtZero(Eval("tempRil")) %>' class="fa fa-thermometer-empty text-danger" aria-hidden="true"></i>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<i runat="server" visible='<%# gtZero(Eval("tempRil")) %>' class="fa fa-thermometer text-success" aria-hidden="true"></i>
|
||||
|
||||
|
||||
</asp:LinkButton>
|
||||
</div>
|
||||
</ItemTemplate>
|
||||
|
||||
@@ -191,9 +191,9 @@ namespace GPW_Commesse.WebUserControls
|
||||
|
||||
private void editTemp(string dataRif)
|
||||
{
|
||||
DateTime adesso = DateTime.Today;
|
||||
CultureInfo ita = new CultureInfo("it-IT");
|
||||
cmp_rilTemp.dtRif = Convert.ToDateTime(dataRif, ita);
|
||||
cmp_chart.dtRif = Convert.ToDateTime(dataRif, ita);
|
||||
//salvo in sessione dati x detail timbrature
|
||||
memLayer.ML.setSessionVal("idxDip_det", DataProxy.idxDipendente);
|
||||
// imposto modalità
|
||||
|
||||
@@ -86,6 +86,15 @@ namespace GPW_Commesse.WebUserControls
|
||||
/// </remarks>
|
||||
protected global::GPW_Commesse.WebUserControls.cmp_rilTemp cmp_rilTemp;
|
||||
|
||||
/// <summary>
|
||||
/// Controllo cmp_chart.
|
||||
/// </summary>
|
||||
/// <remarks>
|
||||
/// Campo generato automaticamente.
|
||||
/// Per la modifica, spostare la dichiarazione di campo dal file di progettazione al file code-behind.
|
||||
/// </remarks>
|
||||
protected global::GPW_Commesse.WebUserControls.cmp_chart cmp_chart;
|
||||
|
||||
/// <summary>
|
||||
/// Controllo pnlEditOre.
|
||||
/// </summary>
|
||||
|
||||
@@ -20,8 +20,18 @@
|
||||
</div>
|
||||
<canvas id="myChartHist" width="300" height="120"></canvas>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
//var prm = Sys.WebForms.PageRequestManager.getInstance();
|
||||
//prm.add_pageLoaded(pageLoaded);
|
||||
|
||||
//function pageLoaded(sender, args) {
|
||||
// console.log('pageLoaded!');
|
||||
// // chiamo recupero dati + plot della TS e dell'Histogram
|
||||
// plotTS();
|
||||
// plotHist();
|
||||
//}
|
||||
|
||||
<script>
|
||||
// funzione eseguita se successo al caricamento
|
||||
function OnSuccess_(reponse) {
|
||||
|
||||
@@ -148,8 +158,10 @@
|
||||
|
||||
// funzione di drawing ad OGNI pageload!
|
||||
function pageLoad() {
|
||||
//console.log('pageLoad!');
|
||||
// chiamo recupero dati + plot della TS e dell'Histogram
|
||||
plotTS();
|
||||
plotHist();
|
||||
}
|
||||
</script>
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user