This is a migrated thread and some comments may be shown as answers.

Setting the bar size on a horizontal Series

3 Answers 367 Views

Chart (Obsolete)

This is a migrated thread and some comments may be shown as answers.

Aaron Spilman asked on 29 Apr 2010, 10:17 PM

goodchart.png

badchart.png

How do I set the bar size on this horizontal bar chart to a fixed width (or would it be height?) of 27px and allow the overall chart to change size based on the number of rows of data? I would like the bar width to be the same size regardless how many bars are on the chart.

Thank You.

    
                                            <telerik:RadChart ID="chartPropertyStatus" runat="server" DataSourceID="ObjectDataSource1" 
        
                                                Skin="Office2007" SeriesOrientation="Horizontal" Width="1024px"   
        
                                                Visible="True">  
        
                                                <Series> 
        
                                                    <telerik:ChartSeries DataYColumn="DaysActive" Name="Property Status"   
        
                                                        DataLabelsColumn="Label" DataXColumn="OrderBy" Appearance-LegendDisplayMode="ItemLabels">  
        
                                                        <Appearance> 
        
                                                            <FillStyle FillType="Solid" MainColor="69, 115, 167">  
        
                                                            </FillStyle> 
        
                                                            <TextAppearance TextProperties-Color="Black">  
        
                                                            </TextAppearance> 
        
                                                            <Border Color="69, 115, 167" /> 
        
                                                        </Appearance> 
        
                                                    </telerik:ChartSeries> 
        
                                                </Series> 
        
                                                <PlotArea> 
        
                                                    <EmptySeriesMessage> 
        
                                                        <TextBlock Text="This Property has no 'Property Status' History yet.">  
        
                                                        </TextBlock> 
        
                                                    </EmptySeriesMessage> 
        
                                                    <XAxis AutoScale="true" DataLabelsColumn="SaleStatus" 
        
                                                        MinValue="1" Step="1" MaxValue="7">  
        
                                                        <Appearance Color="134, 134, 134" MajorTick-Color="134, 134, 134"   
        
                                                            PenStyle="Dash">  
        
                                                            <MajorGridLines Color="134, 134, 134" Width="0" /> 
        
                                                            <TextAppearance TextProperties-Color="Black">  
        
                                                            </TextAppearance> 
        
                                                        </Appearance> 
        
                                                        <AxisLabel> 
        
                                                            <Appearance RotationAngle="270">  
        
                                                            </Appearance> 
        
                                                            <TextBlock> 
        
                                                                <Appearance TextProperties-Color="Black">  
        
                                                                </Appearance> 
        
                                                            </TextBlock> 
        
                                                        </AxisLabel> 
        
                                                        <Items> 
        
                                                            <telerik:ChartAxisItem Value="1">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="2">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="3">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="4">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="5">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="6">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                            <telerik:ChartAxisItem Value="7">  
        
                                                                <TextBlock Text="abc">  
        
                                                                </TextBlock> 
        
                                                            </telerik:ChartAxisItem> 
        
                                                        </Items> 
        
                                                    </XAxis> 
        
                                                    <YAxis> 
        
                                                        <Appearance Color="134, 134, 134" MajorTick-Color="134, 134, 134"   
        
                                                            MinorTick-Color="134, 134, 134">  
        
                                                            <MajorGridLines Color="134, 134, 134" /> 
        
                                                            <MinorGridLines Color="134, 134, 134" /> 
        
                                                            <TextAppearance TextProperties-Color="Black">  
        
                                                            </TextAppearance> 
        
                                                        </Appearance> 
        
                                                        <AxisLabel> 
        
                                                            <Appearance RotationAngle="0">  
        
                                                            </Appearance> 
        
                                                            <TextBlock> 
        
                                                                <Appearance TextProperties-Color="Black">  
        
                                                                </Appearance> 
        
                                                            </TextBlock> 
        
                                                        </AxisLabel> 
        
                                                    </YAxis> 
        
                                                    <YAxis2> 
        
                                                        <AxisLabel> 
        
                                                            <Appearance RotationAngle="0">  
        
                                                            </Appearance> 
        
                                                        </AxisLabel> 
        
                                                    </YAxis2> 
        
                                                    <Appearance Dimensions-Margins="18%, 6%, 12%, 15%">  
        
                                                        <FillStyle FillType="Solid" MainColor="">  
        
                                                        </FillStyle> 
        
                                                    </Appearance> 
        
                                                </PlotArea> 
        
                                                <Appearance> 
        
                                                    <Border Color="134, 134, 134" /> 
        
                                                </Appearance> 
        
                                                <ChartTitle> 
        
                                                    <Appearance> 
        
                                                        <FillStyle MainColor="">  
        
                                                        </FillStyle> 
        
                                                    </Appearance> 
        
                                                    <TextBlock Text="Property Status">  
        
                                                        <Appearance TextProperties-Color="Black" TextProperties-Font="Arial, 18px">  
        
                                                        </Appearance> 
        
                                                    </TextBlock> 
        
                                                </ChartTitle> 
        
                                                <Legend Visible="False">  
        
                                                    <Appearance Dimensions-Margins="15%, 2%, 1px, 1px"   
        
                                                        Dimensions-Paddings="2px, 8px, 6px, 3px" Visible="False">  
        
                                                        <ItemTextAppearance TextProperties-Color="Black">  
        
                                                        </ItemTextAppearance> 
        
                                                        <ItemMarkerAppearance Figure="Square">  
        
                                                        </ItemMarkerAppearance> 
        
                                                    </Appearance> 
        
                                                </Legend> 
        
                                            </telerik:RadChart>

3 Answers, 1 is accepted

answered on 05 May 2010, 08:42 AM

Hi Aaron,

The bar height (for horizontal bars) depends on the number of items of the X axis (he vertical axis in this case). If you need to maintain a constant bar height, no matter how many bars appear in the chart, you can set the XAxis.AutoScale property to false and provide your own range for the axis by setting its MinValue, MaxValue and Step properties.

Best regards,
Ves
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

answered on 05 May 2010, 06:44 PM

badchart2.png

I have tried your suggestion. But nothing seems to change.

    
            <XAxis AutoScale="False" DataLabelsColumn="SaleStatus" 
        
               MinValue="1" Step="5" MaxValue="100">

    
            <XAxis AutoScale="False" DataLabelsColumn="SaleStatus" 
        
               MinValue="1" Step="1" MaxValue="20">

    
            <XAxis AutoScale="False" DataLabelsColumn="SaleStatus" 
        
               MinValue="10" Step="1" MaxValue="20">

What else should I try?

answered on 06 May 2010, 02:01 PM

chartxaxis.zip

Hi Aaron,

I am sorry, I have missed the DataLabelsColumn setting in your original message. This will force RadChart to create X axis items for every item in the underlying datasource but no more than this number. So you will have to add the ChartAxisItems you need manually. Please, find attached an example, showing this.

Greetings,
Ves
the Telerik team