Completed
Last Updated: 13 Nov 2020 19:20 by ADMIN
Release 2.20.0
Created by: Emanuel
Comments: 0
Category: ChunkProgressBar
Type: Bug Report
1

The component does not calculate the chunks correctly. Below you could see a reproduction and as an attached file the result of building it. 

Reproduction:

<TelerikChunkProgressBar Value="@Value"
                         Max="@MaxValue"
                         ChunkCount="@MaxValue">
</TelerikChunkProgressBar>


@code {
    public double Value { get; set; } = 15;
    public int MaxValue { get; set; } = 15;
} 

Completed
Last Updated: 11 Jan 2021 11:42 by ADMIN
Release 2.21.0

---

ADMIN EDIT

When the component calculates the size of the chunks it doesn't seem to use invariant culture so when the decimal separator is a comma `,` it puts that comma in the CSS rule, which the browser can't parse and the chunks have wrong sizes which makes them invisible.

Reproducible plus CSS workaround

<h4>Default</h4>

<TelerikChunkProgressBar Value="1" Max="3" ChunkCount="3"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Value="3" Max="3" ChunkCount="3"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Value="1" Max="7" ChunkCount="7"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Value="4" Max="7" ChunkCount="7"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Value="7" Max="7" ChunkCount="7"></TelerikChunkProgressBar>

<h4>With Workaround</h4>

<style>
    .three-chunks-workaround li {
        width: 33.333% !important;
    }

    .seven-chunks-workaround li {
        width: 14.285% !important;
    }
</style>

<TelerikChunkProgressBar Class="three-chunks-workaround" Value="1" Max="3" ChunkCount="3"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Class="three-chunks-workaround" Value="3" Max="3" ChunkCount="3"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Class="seven-chunks-workaround" Value="1" Max="7" ChunkCount="7"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Class="seven-chunks-workaround" Value="4" Max="7" ChunkCount="7"></TelerikChunkProgressBar><br /><br />
<TelerikChunkProgressBar Class="seven-chunks-workaround" Value="7" Max="7" ChunkCount="7"></TelerikChunkProgressBar>

@code{
    protected override void OnInitialized()
    {
        var culture = new System.Globalization.CultureInfo("sv-SE");
        System.Globalization.CultureInfo.DefaultThreadCurrentCulture = culture;
        System.Globalization.CultureInfo.DefaultThreadCurrentUICulture = culture;
        base.OnInitialized();
    }
}