[Solved] Height and BarSeries styling questions

[Jeremy]

I have a ChartView that I'm having a difficult time styling. The attachment shows that state I have it in currently.

I would like to stretch the chart vertically into a more square shape instead of the long strip that I have. Also I need to apply different colors to each barseries. 

How do I do this?

My code is below. Each barseries is bound to a List<TenantData>  The TenantData class is below the XAML

XAML:

<Grid x:Name="LayoutRoot" Background="White">
        <StackPanel Orientation="Vertical">
            <chart:RadCartesianChart>
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month1}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month2}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month3}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month4}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month5}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month6}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month7}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month8}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month9}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month10}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month11}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />
                <chartView:BarSeries CombineMode="Cluster" ItemsSource="{Binding Month12}" ValueBinding="RowsProcessed" CategoryBinding="RollupDate" />

                <chart:RadCartesianChart.HorizontalAxis>
                    <chartView:CategoricalAxis FontFamily="Segoe UI" FontSize="12" Title="Months"></chartView:CategoricalAxis>
                </chart:RadCartesianChart.HorizontalAxis>
                <chart:RadCartesianChart.VerticalAxis>
                    <chartView:LinearAxis FontFamily="Segoe UI" FontSize="12" Title="Row Usage (thousands)"></chartView:LinearAxis>
                </chart:RadCartesianChart.VerticalAxis>
                <chart:RadCartesianChart.Grid>
                    <chartView:CartesianChartGrid Height="600" MajorLinesVisibility="Y"></chartView:CartesianChartGrid>
                </chart:RadCartesianChart.Grid>
            </chart:RadCartesianChart>
            <ScrollViewer Name="UsageDataTable">
                <telerik:RadGridView x:Name="ParentUsageTable" ItemsSource="{Binding Orgs}">
                </telerik:RadGridView>
            </ScrollViewer>
        </StackPanel>
    </Grid>

TenantData object:

public class TenantData
    {
        public long RowsProcessed { get; set; }
        public string TenantName { get; set; }
        public string RollupDate { get; set; }
    }

[Petar Kirov]

Hi Jeremy,

Because you have not specified the height of the chart control, its MinHeight property gets used which is by default 100. To increase the RadCartesianChart height, just set its Height property to a bigger value eg. 500.

On a side note, you can put the 12 ItemsSources in a list and leave the chart to generate the series for them by using the SeriesProvider feature. Here you can learn more about it.
 
Regards,
Petar Kirov
Telerik