This is a migrated thread and some comments may be shown as answers.

Squished category label for chart with one category on iOS?

2 Answers 10 Views
This is a migrated thread and some comments may be shown as answers.
Valentin
Top achievements
Rank 1
Valentin asked on 01 Oct 2018, 09:50 PM

I have a cartesian chart with a numerical vertical axis and categorical horizontal axis.

When the data that's feeding the chart series contains only one category, the category label appears squished on iOS. The same chart renders fine on Android. See the attached screenshots.

I suspect this is a bug and should hopefully be fixed. In the mean time, any suggestions on whether it is possible to work around this, perhaps via a custom renderer?

Here's the code to recreate this:

XAML

<?xml version="1.0" encoding="utf-8" ?>
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:telerikChart="clr-namespace:Telerik.XamarinForms.Chart;assembly=Telerik.XamarinForms.Chart"
             xmlns:local="clr-namespace:ChartBug"
             x:Class="ChartBug.ChartPage">
     
    <ContentPage.BindingContext>
        <local:CategoricalViewModel/>
    </ContentPage.BindingContext>
 
    <Grid>
        <telerikChart:RadCartesianChart>
            <telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:CategoricalAxis ShowLabels="True"/>
            </telerikChart:RadCartesianChart.HorizontalAxis>
            <telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:NumericalAxis Minimum="0" MajorStep="1" Maximum="3" ShowLabels="True"/>
            </telerikChart:RadCartesianChart.VerticalAxis>
 
            <telerikChart:RadCartesianChart.Series>
                <telerikChart:LineSeries ItemsSource="{Binding CategoricalData}" ShowLabels="True">
                    <telerikChart:LineSeries.ValueBinding>
                        <telerikChart:PropertyNameDataPointBinding PropertyName="Value"/>
                    </telerikChart:LineSeries.ValueBinding>
                    <telerikChart:LineSeries.CategoryBinding>
                        <telerikChart:PropertyNameDataPointBinding PropertyName="Category"/>
                    </telerikChart:LineSeries.CategoryBinding>
                    <telerikChart:LineSeries.LabelBinding>
                        <telerikChart:PropertyNameDataPointBinding PropertyName="Value"/>
                    </telerikChart:LineSeries.LabelBinding>
                </telerikChart:LineSeries>
            </telerikChart:RadCartesianChart.Series>
        </telerikChart:RadCartesianChart>
    </Grid>
</ContentPage>

 

Code behind

using System.Collections.ObjectModel;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;
 
namespace ChartBug
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class ChartPage : ContentPage
    {
        public ChartPage()
        {
            InitializeComponent();
        }
    }
 
    public class CategoricalData
    {
        public object Category { get; set; }
        public double Value { get; set; }
    }
 
    public class CategoricalViewModel
    {
        public CategoricalViewModel()
        {
        }
 
        public ObservableCollection<CategoricalData> CategoricalData { get; set; } = new ObservableCollection<CategoricalData>
        {
            new CategoricalData { Category = "One", Value = 1 },
            // new CategoricalData { Category = "Two", Value = 2 }
        };
    }
}

 

Just uncomment the second category as needed.

2 Answers, 1 is accepted

Sort by
0
Accepted
Didi
Telerik team
answered on 08 Oct 2018, 02:42 PM
Hi Valentin,

Thank you for the provided code.

I have tested the described scenario and I reproduced the issue. It seems that the HorizontalAxisLabel is clipped on iOS when only one data is applied. I have logged this in our Feedback portal and you could follow the item on the provided link: Chart: [iOS] HorizontalAxisLabel is not visible when only one data is applied to the chart. Currently, there is no suitable workaround I could suggest. You can also find your Telerik points updated for this report.

Let me know if you have any other questions.

Regards,
Didi
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Valentin
Top achievements
Rank 1
answered on 08 Oct 2018, 03:03 PM
Thank you for confirming. Look forward to a fix soon.
Tags
Chart
Asked by
Valentin
Top achievements
Rank 1
Answers by
Didi
Telerik team
Valentin
Top achievements
Rank 1
Share this question
or