Update gestione pagina test con grafici

This commit is contained in:
Samuele Locatelli
2022-02-22 17:27:38 +01:00
parent aa65d48f5f
commit b760d4fa1a
9 changed files with 107 additions and 88 deletions
+5
View File
@@ -0,0 +1,5 @@
<canvas id="@Id"></canvas>
+97
View File
@@ -0,0 +1,97 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Components;
using System.Net.Http;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Components.Authorization;
using Microsoft.AspNetCore.Components.Forms;
using Microsoft.AspNetCore.Components.Routing;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.Web.Virtualization;
using Microsoft.JSInterop;
using MP.Stats;
using MP.Stats.Shared;
namespace MP.Stats.Components
{
public partial class ChartJsBar
{
[Inject]
IJSRuntime JSRuntime { get; set; }
[Parameter]
public string Id { get; set; } = "MyHist";
[Parameter]
public string Legenda { get; set; } = "Legenda";
[Parameter]
public string[]? Data { get; set; }
[Parameter]
public string[]? Labels { get; set; }
[Parameter]
public string lineColor { get; set; } = "";
[Parameter]
public string backColor { get; set; } = "";
protected override async Task OnAfterRenderAsync(bool firstRender)
{
//if (!firstRender)
//{
await renderChart();
//}
}
/// <summary>
/// Inizializzazione rendering componente
///
/// partendo da qui:
/// https://www.williamleme.com/posts/2020/003-chartjs-blazor/
/// https://www.puresourcecode.com/dotnet/blazor/using-chart-js-with-blazor/
/// https://www.tutorialsteacher.com/csharp/csharp-anonymous-type
/// </summary>
/// <param name = "firstRender"></param>
/// <returns></returns>
protected async Task renderChart()
{
// creazione di un oggetto anonymous type con tutte le opzioni da passare a chart.js
var config = new
{
type = "bar",
options = new
{
responsive = true,
scales = new
{
yAxes = new
{
suggestedMin = 0,
display = true,
ticks = new
{
beginAtZero = true,
maxTicksLimit = 10
}
}
}
},
data = new
{
datasets = new[] {
new {
data = Data,
borderColor = lineColor,
backgroundColor = backColor,
borderWidth = 1,
label = Legenda
}
},
labels = Labels
}
};
await JSRuntime.InvokeVoidAsync("setup", Id, config);
}
}
}
-82
View File
@@ -1,82 +0,0 @@
@inject IJSRuntime JSRuntime
<canvas id="@Id"></canvas>
@code {
[Parameter]
public string Id { get; set; } = "MyHist";
[Parameter]
public string[]? Data { get; set; }
[Parameter]
public string[]? Labels { get; set; }
[Parameter]
public string lineColor { get; set; } = "";
[Parameter]
public string backColor { get; set; } = "";
protected override async Task OnAfterRenderAsync(bool firstRender)
{
//if (!firstRender)
//{
await renderChart();
//}
}
/// <summary>
/// Inizializzazione rendering componente
///
/// partendo da qui:
/// https://www.williamleme.com/posts/2020/003-chartjs-blazor/
/// https://www.puresourcecode.com/dotnet/blazor/using-chart-js-with-blazor/
/// https://www.tutorialsteacher.com/csharp/csharp-anonymous-type
/// </summary>
/// <param name="firstRender"></param>
/// <returns></returns>
protected async Task renderChart()
{
// creazione di un oggetto anonymous type con tutte le opzioni da passare a chart.js
var config = new
{
type = "bar",
options = new
{
responsive = true,
scales = new
{
yAxes = new
{
suggestedMin = 0,
display = true,
ticks = new
{
beginAtZero = true,
maxTicksLimit = 10
}
}
}
},
data = new
{
datasets = new[]
{
new
{
data = Data,
borderColor = lineColor,
backgroundColor = backColor,
borderWidth = 1,
label= "Freq. Osservate"
}
},
labels = Labels
}
};
await JSRuntime.InvokeVoidAsync("setup", Id, config);
}
}
+1 -1
View File
@@ -4,7 +4,7 @@
<TargetFramework>net6.0</TargetFramework>
<RootNamespace>MP.Stats</RootNamespace>
<UserSecretsId>826e877c-ba70-4253-84cb-d0b1cafd4440</UserSecretsId>
<Version>6.14.2202.2216</Version>
<Version>6.14.2202.2217</Version>
</PropertyGroup>
<ItemGroup>
+1 -1
View File
@@ -44,7 +44,7 @@
<BarChart @ref="barChart" TItem="double" OptionsObject="horizontalLineChartOptions" />
</div>*@
<div class="col-6">
<ChartJsHist Id="TestBar" Data="@histData" Labels="@histLabel" lineColor="rgb(7, 173, 236)" backColor="rgba(107, 223, 255, 0.5)"></ChartJsHist>
<ChartJsBar Id="TestBar" Data="@histData" Labels="@histLabel" lineColor="rgb(7, 173, 236)" backColor="rgba(107, 223, 255, 0.5)" Legenda="Freq. Osservate"></ChartJsBar>
</div>
<div class="col-6">
<ChartJsStepLine Id="TestTS" DataTS="@dataList" lineColor="rgb(7, 173, 236)" backColor="rgba(107, 223, 255, 0.3)"></ChartJsStepLine>
-1
View File
@@ -13,7 +13,6 @@ using Microsoft.AspNetCore.Components.Web.Virtualization;
using Microsoft.JSInterop;
using MP.Data;
using MP.Stats;
using MP.Stats.Shared;
namespace MP.Stats.Pages
{
+1 -1
View File
@@ -1,6 +1,6 @@
<body>
<i>Modulo statistiche MAPO</i>
<h4>Versione: 6.14.2202.2216</h4>
<h4>Versione: 6.14.2202.2217</h4>
<br />
Note di rilascio:
<ul>
+1 -1
View File
@@ -1 +1 @@
6.14.2202.2216
6.14.2202.2217
+1 -1
View File
@@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<item>
<version>6.14.2202.2216</version>
<version>6.14.2202.2217</version>
<url>https://nexus.steamware.net/repository/SWS/MP-STATS/stable/LAST/MP.Stats.zip</url>
<changelog>https://nexus.steamware.net/repository/SWS/MP-STATS/stable/LAST/ChangeLog.html</changelog>
<mandatory>false</mandatory>