Search code examples
wpfaxis-labelslivecharts

How to style LiveChart's CartesianChart AxisX Labels?


I've searched around the web, but have not found what I'm looking for or even if its possible at all (so far). I have a cartesian chart and what I would like to do, is style the labels of the AxisX. I've seen how to change it's colour, for instance, by setting the foreground of the Axis, but, what I would like to achieve with this style, is to align the label's content by centering them. Seems pretty basic as setting 'HorizontalContentAlignment' to 'Center', but I haven't figured out how to do it.

Here is an extract of my sample code:

        <lc:CartesianChart LegendLocation="Top">
            <lc:CartesianChart.ChartLegend>
                <local:MonthlySummaryCustomLegendView />
            </lc:CartesianChart.ChartLegend>
            <lc:CartesianChart.AxisX>
                <lc:Axis Title="Days of Month"
                         ShowLabels="True"
                         MaxValue="28"
                         MinValue="1">
                    <lc:Axis.Separator>
                        <lc:Separator Step="1" 
                                      IsEnabled="False">
                        </lc:Separator>
                    </lc:Axis.Separator>
                </lc:Axis>
            </lc:CartesianChart.AxisX>
        </lc:CartesianChart>
        (...)

And this is a screenshot of how it currently renders:

Thank you all in advance, any help or guidelines will be much appreciated.


Solution

  • I don't think there is a clean and easy way.

    • You can't really differentiate the axis labels via the visual tree: Visual Tree
    • You can't access the TextBlock property of the AxisSeparatorElement without reflection as it's internal