WPF Multiple DataTriggers targeting the same property with Animation

Question

I have created a UserControl which is basically an Ellipse with a DependencyProperty called ValueH. The Fill property of the Ellipse is based on ValueH. So for example if ValueH=1 Fill=Red, ValueH=2 Fill=Blue, ValueH=3 Fill=Green and so on. I have also declared storyboards so that when the value of ValueH changes, a ColorAnimation is run from its current color to the prefered Fill color.

The animations runs smootly if ValueH is increased, for example from 1 to 4 or 2 to 5. This is also the order in which data triggers are defined in code. However, when the value decreases from 5 to 2, the Ellipse Fill color is turned Black, its initial color, and then the animations starts from there. It looks like that when the value is decreased the animations always start from beginning, rather than from the current value.

Is this a problem with how the storyboards are started and removed? I would appreciate your Help.

This is what I have come up with:

<Ellipse x:Name="ellipse" Width="10" Height="10" Stroke="Transparent" Fill="Black">
            <Ellipse.Style>
                <Style TargetType="{x:Type Ellipse}">
                    <!--<Setter Property="Fill" Value="Black"/>-->
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ValueH,ElementName=control1,Converter={StaticResource numConvert}}" Value="1">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard1}" x:Name="storyplayed1"/>
                            </DataTrigger.EnterActions>     
                            <DataTrigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="storyplayed1"/>
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ValueH,ElementName=control1,Converter={StaticResource numConvert}}" Value="2">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard2}" x:Name="storyplayed2"/>
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="storyplayed2"/>                               
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ValueH,ElementName=control1,Converter={StaticResource numConvert}}" Value="3">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard3}" x:Name="storyplayed3"/>
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="storyplayed3"/>                            
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ValueH,ElementName=control1,Converter={StaticResource numConvert}}" Value="4">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard4}" x:Name="storyplayed4"/>
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="storyplayed4"/>                                
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding ValueH,ElementName=control1,Converter={StaticResource numConvert}}" Value="5">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource Storyboard5}" x:Name="storyplayed5"/>
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <RemoveStoryboard BeginStoryboardName="storyplayed5"/>                                
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Ellipse.Style>
        </Ellipse>

And this is one of the Storyboards, which are all similar.

<Storyboard x:Key="Storyboard1">
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
                <EasingColorKeyFrame KeyTime="0:0:2" Value="Red"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>