Hi,
I would like to be able to show / hide a serie by clicking to a legend.
Is there a way to do it actually ?
Hello,
Please consider a built-in way to add spacing (gaps, margins, etc.) between the segments of a Donut and Pie charts. The <ChartSeries> tag has such parameters, but they are used for other settings or other series types.
Currently, it is possible to achieve the desired appearance with custom CSS, but that requires knowledge about the Chart rendering.
I want horizontal and vertical lines in the chart to act as markers (limits, thresholds). It would be awesome if there was a way to simply draw a horizontal and vertical lines, bound to a collection of y and x data respectively.
Something like the below would be nice
<TelerikChart>
<ChartSeriesItems>
<ChartSeries Type="@ChartSeriesType.Line" Name="@P_Name1" Color="blue"
Data="@P_Data1"
Field="@P_Field1"
CategoryField="@P_CategoryField1">
<ChartSeriesLabels Visible="true" Template="#=dataItem.P_Description#" />
<ChartSeriesMarkers Size="4" />
</ChartSeries>
<ChartHorizontalLines Data="@YLinesData"/>
<ChartVerticalLines Data="@XLinesData"/>
</ChartSeriesItems>
</TelerikChart>
@code{
List<double> YLinesData, XLinesData;
}
---
ADMIN EDIT
You can find some more details and ideas for workarounds here to consider in the meantime.
---
Our Site supports multiple themes that we have built using the SASS Theme Builder. For all Telerik Components we have used so far the theme changes on them as expected when using the example found here (Change Theme at Runtime). The problem seems to be the chart component will not adhere to the newly applied theme after its initial load. Seems like this is because it is shown as an SVG with hardcoded attributes on the element. Is there a workaround for this (other than reloading the components entirely)?
Before & After Theme Change:
Hi
We would like to be able to draw a label for a group of series in the chart axis while also labelling the series individually. See the following example:
In Kendo UI you can achieve this: https://dojo.telerik.com/ulIJihIF. In Blazor, we can force the text into the chart axis categories, but we cannot seem to position them accurately, REPL.
Thank you
It would be helpful to me if this chart type was supported.
In need a chart that has a shaded area between a max and min set of curves, indicating the allowable area
Like this one: https://demos.telerik.com/kendo-ui/range-area-charts/index
Hi,
Just a bug I have found. I have found something similar before with the DateTime format of a category axis.
Please note the single lowercase 't' in the below appears to be being interpreted by the compiler as 'time' identifier (AM or PM). In this case, it is printing on the chart label as 'a'.
<ChartValueAxes>
<ChartValueAxis AxisCrossingValue="@AxisCrossingValue">
<ChartValueAxisLabels Format="@("{0}" + " a b c d e f g h i j k l m n o p q r s t u v w x y z")"></ChartValueAxisLabels>
</ChartValueAxis>
</ChartValueAxes>
I discovered this as my original unit was 'Count' which was being displayed at runtime on the chart as 'Couna'.
I would like to control the font of the Value axis labels in a similar fashion to the way I can control the labels of the category axis:
<ChartCategoryAxes>
<ChartCategoryAxis Categories="@xAxisItems">
<ChartCategoryAxisLabels Font="bold 12px 'Helvetica'"></ChartCategoryAxisLabels>
</ChartCategoryAxis>
</ChartCategoryAxes>*** Thread created by admin on customer behalf ***
I am trying to customize the format of the ChartCategoryAxisLabels to render the abbreviated name of the day of the week using the following format:
<ChartCategoryAxisLabels Format="ddd dd/MM HH:mm"/>While it is a valid format, it seems that it doesn't work for the category labels.
---
ADMIN EDIT
---
For the time being, you can use the following to render the abbreviated name of the day of the week in the ChartCategoryAxisLabels:
<ChartCategoryAxisLabels Format="{0:EEE dd/MM HH:mm}"/>
After updating the chart data, some elements remain in the DOM. This can clutter the browser if the data updates come in on intervals and the chart remains in operation for a while. A screenshot is attached below.
MCVE:
@using Telerik.Blazor@using Telerik.Blazor.Components.Button@using Telerik.Blazor.Components.Chart<h3>Chart</h3><TelerikButton Primary="true" @onclick="AddDataPoint">Add data point</TelerikButton><TelerikChart Transitions="false"> <TelerikChartSeriesItems> <TelerikChartSeries Type="ChartSeriesType.Line" Name="CPU Usage Data" Data="@simpleData"> </TelerikChartSeries> </TelerikChartSeriesItems> <TelerikChartValueAxes> <TelerikChartValueAxis Max="100" Color="black"></TelerikChartValueAxis> </TelerikChartValueAxes> <TelerikChartTitle Text="CPU Usage"></TelerikChartTitle> <TelerikChartLegend Position="Telerik.Blazor.ChartLegendPosition.Bottom"> </TelerikChartLegend></TelerikChart>@code { void AddDataPoint() { Random random = new Random(); var _val = Math.Round((random.NextDouble() * 100), 3); if (simpleData.Count >= 60) { simpleData = simpleData.TakeLast(59).ToList(); } simpleData.Add(_val); //StateHasChanged(); } public List<object> simpleData = new List<object>();}
If a chart is too narrow and x-axis labels overlap, the user can zoom out and refresh the charts to allow the labels to fit. This feature request is to allow the charts to reformat themselves as the zoom level is changed (without having to refresh the page). Steps to reproduce:
- Make browser narrow (say half screen)
- Change zoom to 500%
- Go to https://demos.telerik.com/blazor-ui/chart/line-chart
- See line chart is squished with overlapping x-axis labels
- Zoom out to 100%
- ÂSee line chart remains squished with overlapping x-axis labels even though there is a lot more room
- Now refresh the page
- See line chart is no longer squished with x-axis labels visible
Is it possible to use a different marker type other than the one provided by ChartSeriesMarkerType enum?
We would like to use a custom icon for some Scatter data but this doesn't seem to be supported out of the box. Please let us know if this is possible in the current framework, if not - can it be added as a feature?
Thanks,
Sean
Expose colored ranges (Plot Bands) to allow highlighting certain areas in the chart plot area - similar to https://demos.telerik.com/kendo-ui/bar-charts/plotbands.
---
ADMIN EDIT
---
This feature will allow you to define certain color ranges in the plot area. If you are looking for ability to color the whole plot area in alternating way, you may check this feature request - Is it possible to change the plot area background color in an alternating way.