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

LinearBar disappearing when UseRangeColor is true

3 Answers 49 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
Matt
Top achievements
Rank 2
Matt asked on 02 Dec 2011, 02:34 PM
When using the following code my linear bar disappears, however if I remove UseRangeColor then the bar appears. I've Attached Images of both outputs

<telerik:RadGauge telerik:StyleManager.Theme="Metro">
    <telerik:LinearGauge Width="300" Height="180">
        <telerik:LinearScale Orientation="Horizontal" Left="0.07" Top="0.28" Min="0" Max="100">
            <telerik:LinearScale.Ranges>
                <telerik:LinearRange Min="0" Max="30" Background="Red" Location="Outside"/>
                <telerik:LinearRange Max="80" Min="30" Background="Orange" Location="Outside"/>
                <telerik:LinearRange Max="100" Min="80" Background="Green" Location="Outside"/>
            </telerik:LinearScale.Ranges>
             
            <telerik:IndicatorList>
                <telerik:LinearBar Name="linearBar"
                                   UseRangeColor="True"
                     RangeColorMode="ProportionalGradient"
                     RangeColorSmoothing="0.5"
                     Value="60" />
            </telerik:IndicatorList>
             
        </telerik:LinearScale>
    </telerik:LinearGauge>
</telerik:RadGauge>

3 Answers, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 07 Dec 2011, 10:05 AM
Hello Matt,

When indicator (LinearBar in this case) has UseRangeColor property set to "True" it uses value of the LinearRange.IndicatorBackground property. None of ranges shown in your XAML has this property set and this is the reason for the missing bar.

Regards,
Andrey Murzov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Grégory
Top achievements
Rank 1
answered on 04 May 2012, 11:32 AM
Could you give us an example, please. I have a radialgauge and I got the same. Can't figure it out how to fill it with  LinearRange.IndicatorBackground. Thank you!
P.S.
I'm using the latest gauge.
0
Andrey
Telerik team
answered on 09 May 2012, 09:11 AM
Hello Grégory,

The new gauge control has the internal XAML structure different from the one used by the old control. Here is an example which demonstrates how the gauge ranges can be used to fill the bar indicator:

<telerik:RadRadialGauge>
    <telerik:RadialScale Name="scale">
        <telerik:RadialScale.Ranges>
            <telerik:GaugeRange Min="0" Max="50"
                                StartWidth="0.1"
                                EndWidth="0.12"
                                Background="Green"
                                IndicatorBackground="Green" />
            <telerik:GaugeRange Min="50" Max="80"
                                StartWidth="0.12"
                                EndWidth="0.14"
                                Background="Yellow"
                                IndicatorBackground="Yellow" />
            <telerik:GaugeRange Min="80" Max="100"
                                StartWidth="0.14"
                                EndWidth="0.16"
                                Background="Red"
                                IndicatorBackground="Red" />
        </telerik:RadialScale.Ranges>
        <telerik:RadialScale.Indicators>
            <telerik:BarIndicator Name="bar"
                                  UseRangeColor="True"
                                  Value="30"/>
        </telerik:RadialScale.Indicators>
    </telerik:RadialScale>
</telerik:RadRadialGauge>
 

All the best,
Andrey Murzov
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Tags
Gauge
Asked by
Matt
Top achievements
Rank 2
Answers by
Andrey
Telerik team
Grégory
Top achievements
Rank 1
Share this question
or