diff --git a/EgwCoreLib.BlazorTest/Pages/TestCompo.razor b/EgwCoreLib.BlazorTest/Pages/TestCompo.razor
index 38697de..6c4dfbc 100644
--- a/EgwCoreLib.BlazorTest/Pages/TestCompo.razor
+++ b/EgwCoreLib.BlazorTest/Pages/TestCompo.razor
@@ -6,7 +6,7 @@
 
 <h3>TestCompo</h3>
 
-@*<div class="row">
+<div class="row">
     <div class="col-6">
         @if (periodo != null)
         {
@@ -18,21 +18,32 @@
     <div class="col-6">
         <PeriodoSel E_PeriodoSel="setPeriodo" CurrPeriodo="@periodo"></PeriodoSel>
     </div>
-</div>*@
+</div>
 
-<Doughnut Type="@Doughnut.ChartType.Doughnut" Data="@Data.ToArray()" BackgroundColor="@colors"></Doughnut>
+<div class="row" style="max-height: 30rem;">
+    <div class="col-2">
+        <Doughnut Id="00" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
+    </div>
+    <div class="col-4">
+        <ChartHist Id="01" Data="@histData(1)" Labels="@histLabel(1)" LineColor="rgb(7, 173, 236)" BackColor="rgba(107, 223, 255, 0.5)" ChartLabel="Ore 01"></ChartHist>
+    </div>
+    <div class="col-4">
+        <ChartHist Id="02" Data="@histData(2)" Labels="@histLabel(2)" LineColor="rgb(173, 7, 236)" BackColor="rgba(223,107,  255, 0.5)" ChartLabel="Ore 02"></ChartHist>
+    </div>
+    <div class="col-2">
+        <Doughnut Id="03" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
+    </div>
+</div>
 
 @code {
-    #if false
 
     protected DtUtils.Periodo? periodo { get; set; } = new DtUtils.Periodo(DtUtils.PeriodSet.ThisTrim);
 
     protected async Task setPeriodo(DtUtils.Periodo newPeriodo)
     {
-    await Task.Delay(1);
-    periodo = newPeriodo;
+        await Task.Delay(1);
+        periodo = newPeriodo;
     }
-#endif
 
     public List<DoughnutStyling> colors = new List<DoughnutStyling>();
 
@@ -51,19 +62,54 @@
         await Task.Delay(1);
     }
 
+    protected double[] SimData()
+    {
+        List<double> answ = new List<double>();
+        double currColor = 0;
+        for (int i = 0; i < 10; i++)
+        {
+            currColor = (double)(rnd.Next(10, 100)) / 10;
+            answ.Add(currColor);
+            if(currColor>7)
+            {
+                colors.Add(new DoughnutStyling("#28FF69", "ccc"));
+            }
+            else if (currColor > 3)
+            {
+                colors.Add(new DoughnutStyling("orange", "ccc"));
+            }
+            else
+            {
+                colors.Add(new DoughnutStyling("red", "ccc"));
+            }
+        }
+        return answ.ToArray();
+    }
+
     protected async Task ReloadData()
     {
-        Data.Clear();
-        Labels.Clear();
-        colors.Clear();
-        for (int x = 0; x < 5; x++)
-        {
-            Data.Add(x);
-            Labels.Add($"test n#: {x} - {x}min");
-            colors.Add(new DoughnutStyling("orange", "ccc"));
-            colors.Add(new DoughnutStyling("#2874A6", "ccc"));
-        }
         await Task.Delay(1);
     }
 
+    protected Random rnd = new Random();
+
+    protected string[] histLabel(int num)
+    {
+        List<string> answ = new List<string>();
+        for (int i = 0; i < 50; i++)
+        {
+            answ.Add($"LBL_{i:00}");
+        }
+        return answ.ToArray();
+    }
+    protected string[] histData(int num)
+    {
+        List<string> answ = new List<string>();
+        for (int i = 0; i < 50; i++)
+        {
+            answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
+        }
+        return answ.ToArray();
+    }
+
 }
diff --git a/EgwCoreLib.Razor/ChartHist.razor b/EgwCoreLib.Razor/ChartHist.razor
index 8d915ba..60523c5 100644
--- a/EgwCoreLib.Razor/ChartHist.razor
+++ b/EgwCoreLib.Razor/ChartHist.razor
@@ -1,5 +1,4 @@
 @using Microsoft.JSInterop
-@inject IJSRuntime JSRuntime
 
 <canvas id="@Id"></canvas>
 
diff --git a/EgwCoreLib.Razor/ChartHist.razor.cs b/EgwCoreLib.Razor/ChartHist.razor.cs
index 664d5de..f905623 100644
--- a/EgwCoreLib.Razor/ChartHist.razor.cs
+++ b/EgwCoreLib.Razor/ChartHist.razor.cs
@@ -8,10 +8,13 @@ namespace EgwCoreLib.Razor
         #region Public Properties
 
         [Parameter]
-        public string BackColor { get; set; } = "";
+        public bool AddSlash { get; set; } = false;
 
         [Parameter]
-        public string TextColor { get; set; } = "";
+        public int AnimationTime { get; set; } = 0;
+
+        [Parameter]
+        public string BackColor { get; set; } = "";
 
         [Parameter]
         public string ChartLabel { get; set; } = "";
@@ -20,7 +23,10 @@ namespace EgwCoreLib.Razor
         public string[]? Data { get; set; }
 
         [Parameter]
-        public string Id { get; set; } = "MyHist";
+        public string GridColor { get; set; } = "";
+
+        [Parameter]
+        public string Id { get; set; } = "000";
 
         [Parameter]
         public string[]? Labels { get; set; }
@@ -29,10 +35,7 @@ namespace EgwCoreLib.Razor
         public string LineColor { get; set; } = "";
 
         [Parameter]
-        public string GridColor { get; set; } = "";
-
-        [Parameter]
-        public int AnimationTime { get; set; } = 0;
+        public string TextColor { get; set; } = "";
 
         #endregion Public Properties
 
@@ -40,6 +43,13 @@ namespace EgwCoreLib.Razor
 
         protected override async Task OnAfterRenderAsync(bool firstRender)
         {
+            string jsPath = "./_content/EgwCoreLib.Razor/ChartHist.razor.js";
+            if (AddSlash)
+            {
+                jsPath = "/." + jsPath;
+            }
+            module = await JSRuntime.InvokeAsync<IJSObjectReference>("import", jsPath);
+            await Task.Delay(50);
             await renderChart();
         }
 
@@ -59,7 +69,8 @@ namespace EgwCoreLib.Razor
                 type = "bar",
                 options = new
                 {
-                    responsive = true,
+                    Responsive = true,
+                    MaintainAspectRatio = false,
                     scales = new
                     {
                         yAxes = new
@@ -128,5 +139,14 @@ namespace EgwCoreLib.Razor
         }
 
         #endregion Protected Methods
+
+        #region Private Properties
+
+        [Inject]
+        private IJSRuntime JSRuntime { get; set; } = null!;
+
+        private IJSObjectReference module { get; set; } = null!;
+
+        #endregion Private Properties
     }
 }
\ No newline at end of file
diff --git a/EgwCoreLib.Razor/ChartHist.razor.js b/EgwCoreLib.Razor/ChartHist.razor.js
new file mode 100644
index 0000000..2e45682
--- /dev/null
+++ b/EgwCoreLib.Razor/ChartHist.razor.js
@@ -0,0 +1,12 @@
+///Setup del chart desiderato con id univoco
+window.setup = (id, config) => {
+    var ctx = document.getElementById(id);
+    if (window['myChart' + id] instanceof Chart) {
+        window['myChart' + id].destroy();
+        window['myChart' + id] = new Chart(ctx, config);
+    }
+    else {
+        window['myChart' + id] = new Chart(ctx, config);
+    }
+
+}
\ No newline at end of file
diff --git a/EgwCoreLib.Razor/ChartTS.razor b/EgwCoreLib.Razor/ChartTS.razor
index 8d915ba..60523c5 100644
--- a/EgwCoreLib.Razor/ChartTS.razor
+++ b/EgwCoreLib.Razor/ChartTS.razor
@@ -1,5 +1,4 @@
 @using Microsoft.JSInterop
-@inject IJSRuntime JSRuntime
 
 <canvas id="@Id"></canvas>
 
diff --git a/EgwCoreLib.Razor/ChartTS.razor.cs b/EgwCoreLib.Razor/ChartTS.razor.cs
index 426c68c..a7a6461 100644
--- a/EgwCoreLib.Razor/ChartTS.razor.cs
+++ b/EgwCoreLib.Razor/ChartTS.razor.cs
@@ -1,12 +1,6 @@
-using System;
-using System.Collections.Generic;
-using System.Drawing;
-using System.Linq;
-using System.Threading.Tasks;
-using Microsoft.AspNetCore.Components;
-using Microsoft.AspNetCore.Components.Web;
-using Microsoft.JSInterop;
 using EgwCoreLib.Razor.Data;
+using Microsoft.AspNetCore.Components;
+using Microsoft.JSInterop;
 
 namespace EgwCoreLib.Razor
 {
@@ -14,28 +8,33 @@ namespace EgwCoreLib.Razor
     {
         #region Public Properties
 
+        [Parameter]
+        public bool AddSlash { get; set; } = false;
+
         [Parameter]
         public int AnimationTime { get; set; } = 0;
 
         [Parameter]
         public string BackColor { get; set; } = "";
 
-        [Parameter]
-        public string TextColor { get; set; } = "";
-        [Parameter]
-        public string GridColor { get; set; } = "";
-
         [Parameter]
         public string ChartLabel { get; set; } = "";
 
         [Parameter]
         public List<chartJsData.chartJsTSerie> DataTS { get; set; } = null!;
 
+        [Parameter]
+        public string GridColor { get; set; } = "";
+
         [Parameter]
         public string Id { get; set; } = "MyTs";
+
         [Parameter]
         public string LineColor { get; set; } = "";
 
+        [Parameter]
+        public string TextColor { get; set; } = "";
+
         #endregion Public Properties
 
         #region Protected Methods
@@ -43,27 +42,30 @@ namespace EgwCoreLib.Razor
         /// <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
+        /// 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>
+        /// <param name="firstRender"></param>
         /// <returns></returns>
         protected override async Task OnAfterRenderAsync(bool firstRender)
         {
+            string jsPath = "./_content/EgwCoreLib.Razor/ChartHist.razor.js";
+            if (AddSlash)
+            {
+                jsPath = "/." + jsPath;
+            }
+            module = await JSRuntime.InvokeAsync<IJSObjectReference>("import", jsPath);
+            await Task.Delay(50);
             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
+        /// 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>
+        /// <param name="firstRender"></param>
         /// <returns></returns>
         protected async Task renderChart()
         {
@@ -73,7 +75,8 @@ namespace EgwCoreLib.Razor
                 type = "line",
                 options = new
                 {
-                    responsive = true,
+                    Responsive = true,
+                    MaintainAspectRatio = false,
                     scales = new
                     {
                         yAxes = new
@@ -141,5 +144,14 @@ namespace EgwCoreLib.Razor
         }
 
         #endregion Protected Methods
+
+        #region Private Properties
+
+        [Inject]
+        private IJSRuntime JSRuntime { get; set; } = null!;
+
+        private IJSObjectReference module { get; set; } = null!;
+
+        #endregion Private Properties
     }
 }
\ No newline at end of file
diff --git a/EgwCoreLib.Razor/ChartTS.razor.js b/EgwCoreLib.Razor/ChartTS.razor.js
new file mode 100644
index 0000000..2e45682
--- /dev/null
+++ b/EgwCoreLib.Razor/ChartTS.razor.js
@@ -0,0 +1,12 @@
+///Setup del chart desiderato con id univoco
+window.setup = (id, config) => {
+    var ctx = document.getElementById(id);
+    if (window['myChart' + id] instanceof Chart) {
+        window['myChart' + id].destroy();
+        window['myChart' + id] = new Chart(ctx, config);
+    }
+    else {
+        window['myChart' + id] = new Chart(ctx, config);
+    }
+
+}
\ No newline at end of file
diff --git a/EgwCoreLib.Razor/Doughnut.razor b/EgwCoreLib.Razor/Doughnut.razor
index 2e3f38e..ce566e4 100644
--- a/EgwCoreLib.Razor/Doughnut.razor
+++ b/EgwCoreLib.Razor/Doughnut.razor
@@ -16,8 +16,8 @@
         Doughnut
     }
 
-    //[Parameter]
-    public string Id { get; set; } = "myChart";
+    [Parameter]
+    public string Id { get; set; } = "000";
 
     [Parameter]
     public ChartType Type { get; set; }
@@ -53,16 +53,18 @@
             Options = new
             {
                 Responsive = true,
+                MaintainAspectRatio = false
             },
             Data = new
             {
                 Datasets = new[]
                 {
-                    new { Data = Data, BackgroundColor = BackgroundColor.Select(x=>x.color), borderColor = BackgroundColor.Select(x=>x.border), borderWidth= 0, offset= 1, borderRadius = 0
-    }
-},
+                    new { Data = Data, BackgroundColor = BackgroundColor.Select(x=>x.color), borderColor = BackgroundColor.Select(x=>x.border), borderWidth= 0, offset= 1, borderRadius = 0 }
+                },
                 Labels = Labels
-            }
+            },
+            Responsive = true,
+            MaintainAspectRatio = false
         };
 
         await JSRuntime.InvokeVoidAsync("setup", Id, config);
diff --git a/EgwCoreLib.Razor/Doughnut.razor.js b/EgwCoreLib.Razor/Doughnut.razor.js
index fdc89d2..2e45682 100644
--- a/EgwCoreLib.Razor/Doughnut.razor.js
+++ b/EgwCoreLib.Razor/Doughnut.razor.js
@@ -1,12 +1,12 @@
 ///Setup del chart desiderato con id univoco
 window.setup = (id, config) => {
     var ctx = document.getElementById(id);
-    if (window['myChart'] instanceof Chart) {
-        window['myChart'].destroy();
-        window['myChart'] = new Chart(ctx, config);
+    if (window['myChart' + id] instanceof Chart) {
+        window['myChart' + id].destroy();
+        window['myChart' + id] = new Chart(ctx, config);
     }
     else {
-        window['myChart'] = new Chart(ctx, config);
+        window['myChart' + id] = new Chart(ctx, config);
     }
 
 }
\ No newline at end of file
diff --git a/EgwCoreLib.Razor/EgwCoreLib.Razor.csproj b/EgwCoreLib.Razor/EgwCoreLib.Razor.csproj
index d420450..8bd3f95 100644
--- a/EgwCoreLib.Razor/EgwCoreLib.Razor.csproj
+++ b/EgwCoreLib.Razor/EgwCoreLib.Razor.csproj
@@ -29,10 +29,20 @@
   </ItemGroup>
 
   <ItemGroup>
+    <None Remove="ChartHist.razor.js" />
+    <None Remove="ChartTS.razor.js" />
     <None Remove="Doughnut.razor.js" />
   </ItemGroup>
 
   <ItemGroup>
+    <Content Include="ChartTS.razor.js">
+      <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
+      <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
+    </Content>
+    <Content Include="ChartHist.razor.js">
+      <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
+      <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
+    </Content>
     <Content Include="Doughnut.razor.js">
       <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
       <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>