...
This commit is contained in:
mmrbnjd
175
TaxPayerFull/Layout/SaleChart.razor
Normal file
175
TaxPayerFull/Layout/SaleChart.razor
Normal file
@@ -0,0 +1,175 @@
|
|||||||
|
@using Color = System.Drawing.Color
|
||||||
|
@using Shared.DTOs
|
||||||
|
|
||||||
|
<LineChart @ref="lineChart" Width="500" Class="mb-4" />
|
||||||
|
|
||||||
|
@* <Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await RandomizeAsync()"> Randomize </Button>
|
||||||
|
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDatasetAsync()"> Add Dataset </Button>
|
||||||
|
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDataAsync()"> Add Data </Button>
|
||||||
|
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowHorizontalLineChartAsync()"> Horizontal Line Chart </Button>
|
||||||
|
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowVerticalLineChartAsync()"> Vertical Line Chart </Button>
|
||||||
|
*@
|
||||||
|
@code {
|
||||||
|
private LineChart lineChart = default!;
|
||||||
|
private LineChartOptions lineChartOptions = default!;
|
||||||
|
private ChartData chartData = default!;
|
||||||
|
public List<IdNameByCount<int>> items = new List<IdNameByCount<int>>();
|
||||||
|
private int datasetsCount = 0;
|
||||||
|
private int labelsCount = 0;
|
||||||
|
|
||||||
|
private Random random = new();
|
||||||
|
|
||||||
|
protected override void OnInitialized()
|
||||||
|
{
|
||||||
|
items.AddRange(new List<IdNameByCount<int>>()
|
||||||
|
{
|
||||||
|
new IdNameByCount<int>{ID=0,Title="1",count=10},
|
||||||
|
new IdNameByCount<int>{ID=1,Title="2",count=5},
|
||||||
|
new IdNameByCount<int>{ID=2,Title="3",count=12},
|
||||||
|
new IdNameByCount<int>{ID=3,Title="4",count=21}
|
||||||
|
});
|
||||||
|
chartData = new ChartData { Labels = GetDefaultDataLabels(), Datasets = GetDefaultDataSets(1) };
|
||||||
|
lineChartOptions = new() { Responsive = true, Interaction = new Interaction { Mode = InteractionMode.Index } };
|
||||||
|
}
|
||||||
|
|
||||||
|
protected override async Task OnAfterRenderAsync(bool firstRender)
|
||||||
|
{
|
||||||
|
if (firstRender)
|
||||||
|
{
|
||||||
|
await lineChart.InitializeAsync(chartData, lineChartOptions);
|
||||||
|
}
|
||||||
|
await base.OnAfterRenderAsync(firstRender);
|
||||||
|
}
|
||||||
|
|
||||||
|
// private async Task RandomizeAsync()
|
||||||
|
// {
|
||||||
|
// if (chartData is null || chartData.Datasets is null || !chartData.Datasets.Any()) return;
|
||||||
|
|
||||||
|
// var newDatasets = new List<IChartDataset>();
|
||||||
|
|
||||||
|
// foreach (var dataset in chartData.Datasets)
|
||||||
|
// {
|
||||||
|
// if (dataset is LineChartDataset lineChartDataset
|
||||||
|
// && lineChartDataset is not null
|
||||||
|
// && lineChartDataset.Data is not null)
|
||||||
|
// {
|
||||||
|
// var count = lineChartDataset.Data.Count;
|
||||||
|
|
||||||
|
// var newData = new List<double>();
|
||||||
|
// for (var i = 0; i < count; i++)
|
||||||
|
// {
|
||||||
|
// newData.Add(random.Next(200));
|
||||||
|
// }
|
||||||
|
|
||||||
|
// lineChartDataset.Data = newData;
|
||||||
|
// newDatasets.Add(lineChartDataset);
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// chartData.Datasets = newDatasets;
|
||||||
|
|
||||||
|
// await lineChart.UpdateAsync(chartData, lineChartOptions);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// private async Task AddDatasetAsync()
|
||||||
|
// {
|
||||||
|
// if (chartData is null || chartData.Datasets is null) return;
|
||||||
|
|
||||||
|
// var chartDataset = GetRandomLineChartDataset();
|
||||||
|
// chartData = await lineChart.AddDatasetAsync(chartData, chartDataset, lineChartOptions);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// private async Task AddDataAsync()
|
||||||
|
// {
|
||||||
|
// if (chartData is null || chartData.Datasets is null)
|
||||||
|
// return;
|
||||||
|
|
||||||
|
// var data = new List<IChartDatasetData>();
|
||||||
|
// foreach (var dataset in chartData.Datasets)
|
||||||
|
// {
|
||||||
|
// if (dataset is LineChartDataset lineChartDataset)
|
||||||
|
// data.Add(new LineChartDatasetData(lineChartDataset.Label, random.Next(200)));
|
||||||
|
// }
|
||||||
|
|
||||||
|
// chartData = await lineChart.AddDataAsync(chartData, GetNextDataLabel(), data);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// private async Task ShowHorizontalLineChartAsync()
|
||||||
|
// {
|
||||||
|
// lineChartOptions.IndexAxis = "y";
|
||||||
|
// await lineChart.UpdateAsync(chartData, lineChartOptions);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// private async Task ShowVerticalLineChartAsync()
|
||||||
|
// {
|
||||||
|
// lineChartOptions.IndexAxis = "x";
|
||||||
|
// await lineChart.UpdateAsync(chartData, lineChartOptions);
|
||||||
|
// }
|
||||||
|
|
||||||
|
#region Data Preparation
|
||||||
|
|
||||||
|
private List<IChartDataset> GetDefaultDataSets(int numberOfDatasets)
|
||||||
|
{
|
||||||
|
var datasets = new List<IChartDataset>();
|
||||||
|
|
||||||
|
for (var index = 0; index < numberOfDatasets; index++)
|
||||||
|
{
|
||||||
|
datasets.Add(GetRandomLineChartDataset());
|
||||||
|
}
|
||||||
|
|
||||||
|
return datasets;
|
||||||
|
}
|
||||||
|
|
||||||
|
private LineChartDataset GetRandomLineChartDataset()
|
||||||
|
{
|
||||||
|
var c = ColorBuilder.CategoricalTwelveColors[datasetsCount].ToColor();
|
||||||
|
|
||||||
|
datasetsCount += 1;
|
||||||
|
|
||||||
|
return new LineChartDataset()
|
||||||
|
{
|
||||||
|
Label = $"فروش",
|
||||||
|
Data = GetRandomData(),
|
||||||
|
BackgroundColor = new List<string> { c.ToRgbString() },
|
||||||
|
BorderColor = new List<string> { c.ToRgbString() },
|
||||||
|
BorderWidth = new List<double> { 2 },
|
||||||
|
HoverBorderWidth = new List<double> { 4 },
|
||||||
|
PointBackgroundColor = new List<string> { c.ToRgbString() },
|
||||||
|
PointRadius = new List<int> { 0 }, // hide points
|
||||||
|
PointHoverRadius = new List<int> { 4 },
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<double> GetRandomData()
|
||||||
|
{
|
||||||
|
var data = new List<double>();
|
||||||
|
for (var index = 0; index < items.Count; index++)
|
||||||
|
{
|
||||||
|
|
||||||
|
data.Add(decimal.ToDouble(items[index].count.Value));
|
||||||
|
}
|
||||||
|
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
|
||||||
|
private List<string> GetDefaultDataLabels()
|
||||||
|
{
|
||||||
|
|
||||||
|
var labels = new List<string>();
|
||||||
|
for (var index = 0; index < items.Count; index++)
|
||||||
|
{
|
||||||
|
|
||||||
|
labels.Add($"روز {items[index].Title}");
|
||||||
|
}
|
||||||
|
|
||||||
|
return labels;
|
||||||
|
}
|
||||||
|
|
||||||
|
// private string GetNextDataLabel()
|
||||||
|
// {
|
||||||
|
// labelsCount += 1;
|
||||||
|
// return $"روز {labelsCount}";
|
||||||
|
// }
|
||||||
|
|
||||||
|
#endregion Data Preparation
|
||||||
|
}
|
||||||
@@ -1,165 +0,0 @@
|
|||||||
|
|
||||||
@using Color = System.Drawing.Color
|
|
||||||
|
|
||||||
<LineChart @ref="lineChart" Width="500" Class="mb-4" />
|
|
||||||
|
|
||||||
@* <Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await RandomizeAsync()"> Randomize </Button>
|
|
||||||
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDatasetAsync()"> Add Dataset </Button>
|
|
||||||
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await AddDataAsync()"> Add Data </Button>
|
|
||||||
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowHorizontalLineChartAsync()"> Horizontal Line Chart </Button>
|
|
||||||
<Button Type="ButtonType.Button" Color="ButtonColor.Primary" Size="Size.Small" @onclick="async () => await ShowVerticalLineChartAsync()"> Vertical Line Chart </Button>
|
|
||||||
*@
|
|
||||||
@code {
|
|
||||||
private LineChart lineChart = default!;
|
|
||||||
private LineChartOptions lineChartOptions = default!;
|
|
||||||
private ChartData chartData = default!;
|
|
||||||
|
|
||||||
private int datasetsCount = 0;
|
|
||||||
private int labelsCount = 0;
|
|
||||||
|
|
||||||
private Random random = new();
|
|
||||||
|
|
||||||
protected override void OnInitialized()
|
|
||||||
{
|
|
||||||
chartData = new ChartData { Labels = GetDefaultDataLabels(31), Datasets = GetDefaultDataSets(1) };
|
|
||||||
lineChartOptions = new() { Responsive = true, Interaction = new Interaction { Mode = InteractionMode.Index } };
|
|
||||||
}
|
|
||||||
|
|
||||||
protected override async Task OnAfterRenderAsync(bool firstRender)
|
|
||||||
{
|
|
||||||
if (firstRender)
|
|
||||||
{
|
|
||||||
await lineChart.InitializeAsync(chartData, lineChartOptions);
|
|
||||||
}
|
|
||||||
await base.OnAfterRenderAsync(firstRender);
|
|
||||||
}
|
|
||||||
|
|
||||||
private async Task RandomizeAsync()
|
|
||||||
{
|
|
||||||
if (chartData is null || chartData.Datasets is null || !chartData.Datasets.Any()) return;
|
|
||||||
|
|
||||||
var newDatasets = new List<IChartDataset>();
|
|
||||||
|
|
||||||
foreach (var dataset in chartData.Datasets)
|
|
||||||
{
|
|
||||||
if (dataset is LineChartDataset lineChartDataset
|
|
||||||
&& lineChartDataset is not null
|
|
||||||
&& lineChartDataset.Data is not null)
|
|
||||||
{
|
|
||||||
var count = lineChartDataset.Data.Count;
|
|
||||||
|
|
||||||
var newData = new List<double>();
|
|
||||||
for (var i = 0; i < count; i++)
|
|
||||||
{
|
|
||||||
newData.Add(random.Next(200));
|
|
||||||
}
|
|
||||||
|
|
||||||
lineChartDataset.Data = newData;
|
|
||||||
newDatasets.Add(lineChartDataset);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
chartData.Datasets = newDatasets;
|
|
||||||
|
|
||||||
await lineChart.UpdateAsync(chartData, lineChartOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
private async Task AddDatasetAsync()
|
|
||||||
{
|
|
||||||
if (chartData is null || chartData.Datasets is null) return;
|
|
||||||
|
|
||||||
var chartDataset = GetRandomLineChartDataset();
|
|
||||||
chartData = await lineChart.AddDatasetAsync(chartData, chartDataset, lineChartOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
private async Task AddDataAsync()
|
|
||||||
{
|
|
||||||
if (chartData is null || chartData.Datasets is null)
|
|
||||||
return;
|
|
||||||
|
|
||||||
var data = new List<IChartDatasetData>();
|
|
||||||
foreach (var dataset in chartData.Datasets)
|
|
||||||
{
|
|
||||||
if (dataset is LineChartDataset lineChartDataset)
|
|
||||||
data.Add(new LineChartDatasetData(lineChartDataset.Label, random.Next(200)));
|
|
||||||
}
|
|
||||||
|
|
||||||
chartData = await lineChart.AddDataAsync(chartData, GetNextDataLabel(), data);
|
|
||||||
}
|
|
||||||
|
|
||||||
private async Task ShowHorizontalLineChartAsync()
|
|
||||||
{
|
|
||||||
lineChartOptions.IndexAxis = "y";
|
|
||||||
await lineChart.UpdateAsync(chartData, lineChartOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
private async Task ShowVerticalLineChartAsync()
|
|
||||||
{
|
|
||||||
lineChartOptions.IndexAxis = "x";
|
|
||||||
await lineChart.UpdateAsync(chartData, lineChartOptions);
|
|
||||||
}
|
|
||||||
|
|
||||||
#region Data Preparation
|
|
||||||
|
|
||||||
private List<IChartDataset> GetDefaultDataSets(int numberOfDatasets)
|
|
||||||
{
|
|
||||||
var datasets = new List<IChartDataset>();
|
|
||||||
|
|
||||||
for (var index = 0; index < numberOfDatasets; index++)
|
|
||||||
{
|
|
||||||
datasets.Add(GetRandomLineChartDataset());
|
|
||||||
}
|
|
||||||
|
|
||||||
return datasets;
|
|
||||||
}
|
|
||||||
|
|
||||||
private LineChartDataset GetRandomLineChartDataset()
|
|
||||||
{
|
|
||||||
var c = ColorBuilder.CategoricalTwelveColors[datasetsCount].ToColor();
|
|
||||||
|
|
||||||
datasetsCount += 1;
|
|
||||||
|
|
||||||
return new LineChartDataset()
|
|
||||||
{
|
|
||||||
Label = $"فروش",
|
|
||||||
Data = GetRandomData(),
|
|
||||||
BackgroundColor = new List<string> { c.ToRgbString() },
|
|
||||||
BorderColor = new List<string> { c.ToRgbString() },
|
|
||||||
BorderWidth = new List<double> { 2 },
|
|
||||||
HoverBorderWidth = new List<double> { 4 },
|
|
||||||
PointBackgroundColor = new List<string> { c.ToRgbString() },
|
|
||||||
PointRadius = new List<int> { 0 }, // hide points
|
|
||||||
PointHoverRadius = new List<int> { 4 },
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
private List<double> GetRandomData()
|
|
||||||
{
|
|
||||||
var data = new List<double>();
|
|
||||||
for (var index = 0; index < labelsCount; index++)
|
|
||||||
{
|
|
||||||
data.Add(random.Next(200));
|
|
||||||
}
|
|
||||||
|
|
||||||
return data;
|
|
||||||
}
|
|
||||||
|
|
||||||
private List<string> GetDefaultDataLabels(int numberOfLabels)
|
|
||||||
{
|
|
||||||
var labels = new List<string>();
|
|
||||||
for (var index = 0; index < numberOfLabels; index++)
|
|
||||||
{
|
|
||||||
labels.Add(GetNextDataLabel());
|
|
||||||
}
|
|
||||||
|
|
||||||
return labels;
|
|
||||||
}
|
|
||||||
|
|
||||||
private string GetNextDataLabel()
|
|
||||||
{
|
|
||||||
labelsCount += 1;
|
|
||||||
return $"روز {labelsCount}";
|
|
||||||
}
|
|
||||||
|
|
||||||
#endregion Data Preparation
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user