We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

How to label aach item on an axis in a WPF Syncfusion Chart

I am getting a variable number of labels on my x-axis when trying to show a chart. I want a label for each item on the x-axis. I have uploaded a zip file with a picture of the result I'm seeing. Can anyone help me?

My data source is an ObservableCollection<Agent> and I'm trying to plot Agent.FullName (x-axis) by Agent.UnitsSold (y-axis).

public class Agent : INotifyPropertyChanged
    {
        private string m_lastName;
        private string m_firstName;
        private int m_unitsSold;

        public event PropertyChangedEventHandler PropertyChanged;

        public Agent()
        {
            FirstName = string.Empty;
            LastName = string.Empty;
            UnitsSold = 0;
        }

        public string LastName
        {
            get { return m_lastName; }
            set { m_lastName = value; FirePropertyChanged("LastName"); }
        }

        public string FirstName
        {
            get { return m_firstName; }
            set { m_firstName = value; FirePropertyChanged("FirstName"); }
        }

        public string FullName
        { get { return FirstName + " " + LastName; } }

        public int UnitsSold
        {
            get { return m_unitsSold; }
            set { m_unitsSold = value; FirePropertyChanged("UnitsSold"); }
        }

        private void FirePropertyChanged(string propertyName)
        {
            PropertyChangedEventHandler temp = PropertyChanged;
            if (temp != null)
                temp(this, new PropertyChangedEventArgs(propertyName));
        }
    }



<syncfusion:Chart Name="Chart1"  Margin="0" Background="White">
            <syncfusion:Chart.Header>
                <TextBlock FontSize="20" TextWrapping="Wrap" FontWeight="Regular">Agents- Units Sold</TextBlock>
            </syncfusion:Chart.Header>
            <!--Chart area to present chart segments-->
            <syncfusion:ChartArea IsContextMenuEnabled="False" ContextMenu="{x:Null}" >
                <syncfusion:ChartArea.ColorModel>
                    <syncfusion:ChartStyleModel Palette="Metro"/>
                </syncfusion:ChartArea.ColorModel>
                <!--Chart area Legend declaration-->
                <syncfusion:ChartArea.Legend>
                    <syncfusion:ChartLegend Name="Legend1"  syncfusion:Chart.Dock="{Binding ElementName=Position1, Path=SelectedItem, Mode=TwoWay}"></syncfusion:ChartLegend>
                </syncfusion:ChartArea.Legend>
                <syncfusion:ChartArea.PrimaryAxis>
                    <syncfusion:ChartAxis Header="Agents" RangePadding="Normal"  HidePartialLabel="False"  LabelRotateAngle="90" EdgeLabelsDrawingMode="Shift"></syncfusion:ChartAxis>
                </syncfusion:ChartArea.PrimaryAxis>


                <syncfusion:ChartArea.SecondaryAxis>
                    <syncfusion:ChartAxis Header="Units Sold" EdgeLabelsDrawingMode="Shift"></syncfusion:ChartAxis>
                </syncfusion:ChartArea.SecondaryAxis>
                <!--Chart series declaration-->
                <syncfusion:ChartSeries Name="SeriesA" Type="Column" IsIndexed="True" Unit="Units"  DataSource="{Binding Agents}" BindingPathX="FullName" BindingPathsY="UnitsSold" Label="Office" StrokeThickness="0.5" >

                </syncfusion:ChartSeries>
            </syncfusion:ChartArea>
        </syncfusion:Chart>




Attachment: ChartLabel_Example_1433814a.zip

1 Reply

RA Rachel A Syncfusion Team December 22, 2015 05:55 AM UTC

Hi David,

Thanks for contacting Syncfusion support.

You can achieve the requirement by setting the Interval as 1 in ChartAxis(PrimaryAxis) as in the following code example.

[XAML]

              <syncfusion:ChartArea.PrimaryAxis>

                    <syncfusion:ChartAxis Header="Agents" RangePadding="Normal"  HidePartialLabel="False"  Interval="1"

                                          LabelRotateAngle="90" EdgeLabelsDrawingMode="Shift"></syncfusion:ChartAxis>

                </syncfusion:ChartArea.PrimaryAxis>


Please refer the following UG documentation link to know about ChartAxis
http://help.syncfusion.com/wpf/classic-chart/chart-axis

Output:


Regards,
Rachel.A

Loader.
Live Chat Icon For mobile
Up arrow icon