Bullet chart possible?

2 posts, 0 answers
  1. Erling Hagen
    Erling Hagen avatar
    1 posts
    Member since:
    Mar 2009

    Posted 24 Sep 2009 Link to this post

    Hey.

    I've been asked to create a bullet chart on a project. We've used Telerik controls so far, and would like to continue using it, but we can't seem to find a suitable gauge control. The Dundas package has one exactly like the one we require, but if possible we'd like to continue using Telerik. So does anyone now if it's possible to create a bullet chart using this package?

  2. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 25 Sep 2009 Link to this post

    Hello Erling Hagen,

    I would recommend you to use linear gauge control to create bullet chart.  For example:
    <UserControl x:Class="Telerik.SL3.Gauge.Q2._2009.MainPage" 
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
                 xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"   
                 xmlns:control="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Gauge"   
                 xmlns:gauges="clr-namespace:Telerik.Windows.Controls.Gauges;assembly=Telerik.Windows.Controls.Gauge"      
                 Width="400" 
                 Height="300">  
        <Grid x:Name="LayoutRoot"  Background="White">  
            <Grid.Resources> 
                <SolidColorBrush x:Key="PoorBrush" Color="Red" /> 
                <SolidColorBrush x:Key="AverageBrush" Color="Yellow" /> 
                <SolidColorBrush x:Key="GoodBrush" Color="Green" /> 
            </Grid.Resources> 
              
            <Grid.ColumnDefinitions> 
                <ColumnDefinition Width="*" /> 
            </Grid.ColumnDefinitions> 
              
            <Grid.RowDefinitions> 
                <RowDefinition Height="Auto" /> 
                <RowDefinition Height="Auto" /> 
            </Grid.RowDefinitions> 
              
            <!-- Legend --> 
            <Border BorderBrush="Gray"   
                    BorderThickness="2" 
                    HorizontalAlignment="Center">  
                <Grid> 
                    <Grid.ColumnDefinitions> 
                        <ColumnDefinition Width="Auto" /> 
                        <ColumnDefinition Width="Auto" /> 
                        <ColumnDefinition Width="Auto" /> 
                        <ColumnDefinition Width="Auto" /> 
                        <ColumnDefinition Width="Auto" /> 
                        <ColumnDefinition Width="Auto" /> 
                    </Grid.ColumnDefinitions> 
                      
                    <Grid.RowDefinitions> 
                        <RowDefinition Height="Auto" /> 
                    </Grid.RowDefinitions> 
                      
                    <Rectangle Width="16" Height="16" Fill="{StaticResource PoorBrush}" /> 
                    <TextBlock Grid.Column="1" Margin="5,0,5,0" Text="Poor" /> 
                      
                    <Rectangle Grid.Column="2" Width="16" Height="16" Fill="{StaticResource AverageBrush}" /> 
                    <TextBlock Grid.Column="3" Margin="5,0,5,0" Text="Average" /> 
                      
                    <Rectangle Grid.Column="4" Width="16" Height="16" Fill="{StaticResource GoodBrush}" /> 
                    <TextBlock Grid.Column="5" Margin="5,0,5,0" Text="Good" /> 
                </Grid> 
            </Border> 
     
            <!-- Bullet chart --> 
            <gauges:LinearScale Grid.Row="1"   
                                Min="0" 
                                Max="100" 
                                Orientation="Horizontal"   
                                Left="0.1" Top="0.2">  
                <gauges:RangeList> 
                    <gauges:LinearRange Min="0" Max="30"   
                                        Location="OverCenter"   
                                        StartWidth="0.1"   
                                        EndWidth="0.1"   
                                        Background="{StaticResource PoorBrush}" /> 
                    <gauges:LinearRange Min="30" Max="75"   
                                        Location="OverCenter"   
                                        StartWidth="0.1"   
                                        EndWidth="0.1"   
                                        Background="{StaticResource AverageBrush}" /> 
                    <gauges:LinearRange Min="75" Max="100"   
                                        Location="OverCenter"   
                                        StartWidth="0.1"   
                                        EndWidth="0.1"   
                                        Background="{StaticResource GoodBrush}" /> 
                </gauges:RangeList> 
                  
                <gauges:IndicatorList> 
                    <gauges:LinearBar x:Name="linearBar" 
                                      Background="Aqua" 
                                      Value="60" /> 
                </gauges:IndicatorList> 
     
            </gauges:LinearScale> 
     
        </Grid> 
    </UserControl> 
     


    Regards,
    Andrey Murzov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. DevCraft banner
Back to Top