Enhance the Chart date axis label format, so that it's culture-aware in globalization scenarios, and there is no need to set ChartCategoryAxisLabels Format explicitly.
In the meantime, here are a few workarounds for the case when the ChartCategoryAxis BaseUnit is Days and the Chart shows MM/dd labels even to non-US users.
<ChartCategoryAxis BaseUnit="ChartCategoryAxisBaseUnit.Days"
Type="ChartCategoryAxisType.Date">
<ChartCategoryAxisLabels Format="d" />
</ChartCategoryAxis>
<ChartCategoryAxis BaseUnit="ChartCategoryAxisBaseUnit.Days"
Type="ChartCategoryAxisType.Date">
<ChartCategoryAxisLabels Format="@( CultureInfo.CurrentUICulture.DateTimeFormat.MonthDayPattern )" />
</ChartCategoryAxis>
Razor
<ChartCategoryAxis BaseUnit="ChartCategoryAxisBaseUnit.Days"
Type="ChartCategoryAxisType.Date">
<ChartCategoryAxisLabels Format="@( GetShortDayMonthPattern() )" />
</ChartCategoryAxis>
C#
private string GetShortDayMonthPattern()
{
var mdp = CultureInfo.CurrentUICulture.DateTimeFormat.MonthDayPattern;
var separator = CultureInfo.CurrentUICulture.DateTimeFormat.DateSeparator;
string pattern = mdp.IndexOf("M") < mdp.IndexOf("d") ? $"MM{separator}dd" : $"dd{separator}MM";
return pattern;
}
Regards, Author nickname Progress Telerik
I would like to synchronize several Charts, so when I move the mouse through one of them, the other two Charts show crosshairs at the same position as the first hovered Chart.
===
ADMIN EDIT
===
Prerequisite: Chart Crosshair
Hello,
I want to connector to be directly connected with the chart.
See https://dojo.telerik.com/AkEHuSiq/3 for reference.
Thank you.
In Kendo-React chart i can set the property "maxDivision" like this:
<ChartCategoryAxis>
<ChartCategoryAxisItem
maxDivisions={30}
name="categoryAxisName"
categories={categories}
...
and the chart will show only 30 dates in the displayed range, even if zoom in.
Is there a way for doing the same thing in Blazor Chart?
I tryed Type"fit" and MaxDateGroup but i need to show always all the points and this isnot a good solution.
I tryed ChartCategoryAxisLabels Step="number_of_labels_to_render" but when i zoom in the chart
will not show other dates.
Regards,
Davide
To reproduce the problem, hover over the last value of the series. While the Tooltip enters, it causes horizontal and vertical scroll and flickers. Then, it is positioned correctly.
The issue is better observed if you increase the transition speed of the Tooltip wrapper.
Reproduction: https://blazorrepl.telerik.com/cREDloaV42j7Z19G13.
===
ADMIN EDIT
===
A possible workaround for the time being is to alter or stop the Tooltip animation with CSS. Here is a runnable sample demonstrating the approach: https://blazorrepl.telerik.com/QnEjvIOC04hXA6W709
The Scatterline Chart is flipped upside down if the Height is under 100px.
ReproductionThe Chart Tooltip does not render correct values for the data points when the chart is bound to a model, has multiple series and Template is used. The DataItem does not seem to work as expected.
ADMIN EDIT:
If the Chart is bound with Independent Series Binding the FormattedValue will get the correct values.
If the Chart has no Template the correct values for the data points will be displayed
See attached image. I want an option to change position on ticks, like in Kendo (see here).
I can't find an option in docs to move the axis position.
Currently, I get the desired result using SyncFusion Chart Component, attribute LabelPlacement allow selection between OnTicks and BetweenTicks option.
Hi, I can't figure how to use the Min/Max properties of the ChartCategoryAxis because if I set these properties, the chart disappears.
Please help me.
@page "/"
<TelerikChart>
<ChartSeriesItems>
<ChartSeries Type="ChartSeriesType.Line" Name="Test" Data="@mesures"
Field="@nameof(Mesure.Value)" CategoryField="@nameof(Mesure.Date)" Aggregate="ChartSeriesAggregate.Sum">
</ChartSeries>
</ChartSeriesItems>
<ChartCategoryAxes>
<!-- This is OK -->
@*<ChartCategoryAxis BaseUnit="ChartCategoryAxisBaseUnit.Hours" Type="ChartCategoryAxisType.Date" BaseUnitStep="1"></ChartCategoryAxis>*@
<!-- This isn't : nothing is displayed -->
<ChartCategoryAxis Min="@MinDate" Max="@MaxDate" BaseUnit="ChartCategoryAxisBaseUnit.Hours" Type="ChartCategoryAxisType.Date" BaseUnitStep="1"></ChartCategoryAxis>
</ChartCategoryAxes>
</TelerikChart>
@code {
private DateTime MinDate { get; set; } = new DateTime(2019, 01, 01, 13, 0, 0);
private DateTime MaxDate { get; set; } = new DateTime(2019, 01, 01, 17, 0, 0);
public class Mesure
{
public DateTime Date { get; set; }
public int Value { get; set; }
}
public List<Mesure> mesures = new List<Mesure>()
{
new Mesure() { Date = new DateTime(2019, 01, 01, 13, 0, 0), Value = 1 },
new Mesure() { Date = new DateTime(2019, 01, 01, 14, 0, 0), Value = 2 },
new Mesure() { Date = new DateTime(2019, 01, 01, 14, 30, 0), Value = 3 },
new Mesure() { Date = new DateTime(2019, 01, 01, 14, 35, 0), Value = 4 },
new Mesure() { Date = new DateTime(2019, 01, 01, 15, 0, 0), Value = 5 },
new Mesure() { Date = new DateTime(2019, 01, 01, 16, 0, 0), Value = 6 },
new Mesure() { Date = new DateTime(2019, 01, 01, 17, 0, 0), Value = 7 },
};
}
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.
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