TelerikChart Width

Question

Is there a way to make a TelerikChart which nested inside TileLayoutItem to be 100% width of the Content?

Following isn't working, (the chart is being cut at the right end)

<TileLayoutItem ColSpan="2" RowSpan="2">
    <Content>           
        <TelerikChart Width="100%" Height="100%">
            <ChartSeriesItems>
                <ChartSeries Type="ChartSeriesType.Line" Name="Completed" Data="@_clientDuration">
                </ChartSeries>
            </ChartSeriesItems>

            <ChartValueAxes>
                <ChartValueAxis Color="red"></ChartValueAxis>
            </ChartValueAxes>

            <ChartCategoryAxes>
                <ChartCategoryAxis Categories="@_xAxisItems"></ChartCategoryAxis>
            </ChartCategoryAxes>
        </TelerikChart>
    </Content>
</TileLayoutItem>

score 1 · Answer 1 · answered Feb 07 '21 at 19:08

It should work like that unless some more CSS from the web site is breaking things. Also, when the tiles resize you may want to .Refresh() the chart.

The provided snippet runs fine for me when I run it in the boilerplate project template and I add some dummy data, and the same scenario runs in this demo as well.

Thus, the issue is probably related to something specific in the project and if comparing against the demo or a blank project does not help I think the better approach is to contact the Telerik support.

TelerikChart Width

1 Answers1