MS Chart Control Scale - Line graph show 12 months

Question

Hi,

On my X Axis, I have months. The chart shows up to 11 points, i.e. Jan - Nov of the same year, but when I add 12 points (Jan - Dec), it will do an auto label thing and change the interval for every 4 months.

How can I change the graph so that it shows 12 months before it does the auto labels?

Here is the server control code I am currently using.

<asp:CHART ID="Chart1" runat="server" 
    BorderColor="181, 64, 1" BorderDashStyle="Solid" BorderWidth="2" Height="296px" 
    ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" ImageType="Png" 
    Palette="None" Width="700px" 
    BorderlineColor="">
        <legends>
            <asp:Legend BackColor="Transparent" 
                                    Font="Trebuchet MS, 8pt, style=Bold" 
                IsTextAutoFit="False" Name="Default" Alignment="Center" 
                DockedToChartArea="ChartArea1" Docking="Top" IsDockedInsideChartArea="False" 
                Title="Legend">
            </asp:Legend>
        </legends>
        <series>
            <asp:Series BorderColor="180, 26, 59, 105" BorderWidth="2" ChartType="Line" 
                                    Color="220, 65, 140, 240" MarkerSize="6" 
                Name="Series1" ShadowColor="Black" 
                                    ShadowOffset="2" XValueType="DateTime" YValueType="Double" 
                                    LabelFormat="c0" LegendText="Actual" 
                MarkerStyle="Circle">
            </asp:Series>
            <asp:Series BorderColor="180, 26, 59, 105" BorderWidth="2" ChartType="Line" 
                                    Color="220, 224, 64, 10" MarkerSize="6" Name="Series2" ShadowColor="Black" 
                                    ShadowOffset="2" XValueType="DateTime" YValueType="Double" 
                                    LabelFormat="c0" LegendText="Projected" 
                MarkerStyle="Circle">
            </asp:Series>
            <asp:Series BorderColor="180, 26, 59, 105" BorderWidth="2" 
                ChartArea="ChartArea1" ChartType="Line" 
                                    Legend="Default" Name="Series3" LabelFormat="c0" XValueType="DateTime" 
                                    YValueType="Double" Color="0, 192, 192" MarkerSize="6" 
                ShadowColor="Black" ShadowOffset="2" LegendText="Actual Credit Limit" 
                MarkerStyle="Circle">
            </asp:Series>
        </series>
        <chartareas>
            <asp:ChartArea BackColor="#DEEDF7" BackGradientStyle="TopBottom" 
                                    BackSecondaryColor="White" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid" 
                                    Name="ChartArea1" ShadowColor="Transparent">
                <area3dstyle inclination="40" isclustered="False" isrightangleaxes="False" 
                                        lightstyle="Realistic" perspective="9" rotation="25" wallwidth="3" />
                <axisy linecolor="64, 64, 64, 64" islabelautofit="False" 
                                        isstartedfromzero="False">
                    <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" Format="c0" />
                    <majorgrid linecolor="64, 64, 64, 64" />
                </axisy>
                <axisx linecolor="64, 64, 64, 64" intervaloffsettype="Months" 
                                        intervaltype="Months" islabelautofit="False" isstartedfromzero="False">
                    <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" Angle="-60" 
                                            Format="MMM yy" />
                    <majorgrid linecolor="64, 64, 64, 64" />
                </axisx>
            </asp:ChartArea>
        </chartareas>
    </asp:CHART>

Thanks.

Answer 1

Try to change the Chart's Width to a higher value...

<asp:Chart ID="Chart1" runat="server" 
BorderColor="181, 64, 1" BorderDashStyle="Solid" BorderWidth="2" Height="296px" 
ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" ImageType="Png" 
Palette="None" Width="800px" 
BorderlineColor="">

Try to set the inverval property to 1 on axisx:

 <axisx Interval="1" linecolor="64, 64, 64, 64" intervaloffsettype="Months" 
  intervaltype="Months" islabelautofit="False" isstartedfromzero="False">

To fully understand how to format chart axis, take a look at:

Formatting Axis Labels on a Chart

How the Chart Calculates Axis Label Intervals?

On the category axis, the minimum and maximum value types are determined depending on the type of your category field. Any field in a dataset can be categorized into one of three category field types: Numeric, Date/Time and Strings.

Displaying All Labels on the Category Axis

On the value axis, axis intervals provide a consistent measure of the data points on the chart. However, on the category axis, this functionality can cause categories to appear without axis labels. Typically, you want all categories to be labeled. You can set the number of intervals to 1 to show all categories. For more information, see How to: Specify an Axis Interval.