WinRTXAML chart, control style for top label, code

Question

I'm using the WinRTXamlToolkit.Controls.DataVisualization.Charting.Chart object, with a dependent axis integer of 0/1, and an independent axis of time. I'd like to suppress or perhaps rotate the labels at the top of the chart. Are the styles found on the Axis (chart.Axes) or series (LineSeries)? My chart is completely configured through code, snippets below:

EDIT 1/30/2017-3: added hosting XAML page.

<Page
    x:Class="HomeControl.Views.Historical"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:Charting="using:WinRTXamlToolkit.Controls.DataVisualization.Charting"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:HomeControl.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Charting:Chart x:Name="LineChart" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Top" Height="500">
        </Charting:Chart>
    </Grid>
</Page>

EDIT 1/30/2017-2: added remaining code...

var lowDate = records.First().taken.DateTime;
var highDate = records.Last().taken.DateTime;

var allDeviceTelemetry = records.GroupBy(t => t.sensorid).OrderBy(g => g.Key);

var axisTaken = new DateTimeAxis()
    {
        Title = "Taken",
        Orientation = AxisOrientation.X,
        IntervalType = DateTimeIntervalType.Minutes,
        Interval = 5,
        Minimum = lowDate,
        Maximum = highDate,
};
LineChart.Axes.Add(axisTaken);

LineChart.Axes.Add(new LinearAxis()
{
    Title = "State",
    Orientation = AxisOrientation.Y
});

foreach (var deviceTelemetry in allDeviceTelemetry)
{
    var series = new LineSeries()
    {
        Title = deviceTelemetry.Key, // sensorid
        IndependentValuePath = "taken",
        DependentValuePath = "sensorvalueint",
        ItemsSource = deviceTelemetry
    };
    LineChart.Series.Add(series);
}

The area I'm trying to control is in green:

I've played around with some of the other styles, such as the interval and axis titles, I just can't figure out where the data point label styles are?

EDIT 1/30/2017: Here is the tree, with the highlighted object (TextBlock at bottom). I need to figure out how to style this "AxisLabel", "Panel", "AxisGrid" or "CategoryAxis" - through code.

Any hints would be appreciated!

-John

Answer 1

Not a complete answer, since I can't tell how you made labels to show up at the top, but these seem to me like they are more of data point labels rather than axis labels. Running the toolkit's sample app might help you browse the UI tree a bit and make it easier to explore things. Just get the toolkit's source in your VS, hit F5, open the Chart control sample and hit Ctrl+Shift while pointing at a label. Here's what I get when pointing at the category axis:

I would poke around the data points, the series and search for a property called style. Otherwise - browse the source code to find how it gets set up.

Answer 2

I've solved my issue, but not with an outcome I expected - much better.

After experimenting quite a bit, I've learned a few things about the WinRTXAML charting; these observations are from purely a coding perspective, since I am not using static XAML in my page. I am new to the control, so if anyone knows these learnings to be incomplete or misguided please chime in:

• Axes are created dynamically, based on the Series being added, if an appropriate Axis is not predefined (in the Axes property). This creation of axes does not occur until data binding takes place (understandably because the chart needs to reflect on the datatypes of the incoming data).
• The explicit assignment of a series to an axis is achieved through the IndependentAxis and DependentRangeAxis of the Series object. If this is omitted, and assignment will be made implicitly based on the data type of the series bound Value. Conversely, if an axis explicitly assigned to a series it need not be added to the Axes property on the Chart (but it also can be).
• If an axis is explicitly assigned to a series which conflicts with the datatype of that series, a horribly misleading exception is generated. "Assigned independent axis cannot be used. This may be due to an unset Orientation property for the axis."
• A CategoryAxis is automatically generated for a series value of type string, but also when the datatype does not match an existing axis. (I.e. the datatype is cast to a string, then a CategoryAxis is produced/used)

Applying these learnings to my original issue, here's what happened. Although I had a DateTime axis predefined, my incoming datatype for the independent axis was DateTimeOffset. This value was interpreted as a string value, since it was not DateTime (i.e. no implicit conversion). This caused the Chart to generated a CategoryAxis, assign it to the series, and it placed it at the top of the chart. Not understanding this was happening, I didn't want the labels on this top axis, so I was trying to suppress them, but I could not find the axis, since it was not created until AFTER data binding took place.

SOLUTION: make the "taken" value datatype DateTime, this caused the chart to align [explicitly or implicitly] to the DateTimeAxis. Optimization: assign the axis directly to the series, don't bother adding them to the Chart.Axes property.

Thank you @jstreet and @FilipSkakun for taking the time to look at this, I appreciate your attention and patience.

-John