RadHtmlChart rendering axis labels and title under axis instead of chart

[Sean]

I am attempting to display several dynamically generated series in a line chart using the RadHtmlChart, however the axis labels and title are rendering under the axis instead of the chart (DefaultRendering.png). I found a similar question that had the answer of "use the 'AxisCrossingValue' of the YAxis"; when i apply the minimum chart value i get the result in "RenderingWithAxisCrossingValue.png". How can I get the chart to render with both title and labels below the chart area as depicted in "RequiredRendering.png"?
Thanks,
Sean

[Danail Vasilev]

Hello Sean,

In the current version of RadControls it is not possible to directly move the XAxis labels and title below the chart's plot area. You can achieve that, however, by setting appropriate margin/padding to the XAxis' labes and titles. For example:

<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server">
    <PlotArea>
        <Series>
            <telerik:LineSeries>
                <SeriesItems>
                    <telerik:CategorySeriesItem Y="300" />
                    <telerik:CategorySeriesItem Y="-200" />
                    <telerik:CategorySeriesItem Y="100" />
                </SeriesItems>
            </telerik:LineSeries>
        </Series>
        <XAxis>
            <TitleAppearance Text="Axis Title">
                <TextStyle Margin="-150px" />
            </TitleAppearance>
            <LabelsAppearance>
                <TextStyle Margin="160px" />
            </LabelsAppearance>
            <Items>
                <telerik:AxisItem LabelText="item1" />
                <telerik:AxisItem LabelText="item2" />
                <telerik:AxisItem LabelText="item3" />
            </Items>
        </XAxis>
    </PlotArea>
</telerik:RadHtmlChart>

Note that setting margin/padding to chart's elements will modify the dimensions of the chart itself, in order to fit in with the set width and height.

You can also find useful Labels and Titles Font Settings help article.


Regards,
Danail Vasilev
Telerik