BounceEase and silverlight 4 BarSeries
I am trying to get a bar series to "bounce" when drawing, I assumed the BounceEase TransitionEasingFunction would do this but the lines just fade in, I have posted the xaml and code behind below, does anyone know where I have gone wrong or is it more complex than I though, I am fairly new to silverlight
XAML
<Grid x:Name="LayoutRoot" Background="White">
<chartingToolkit:Chart x:Name="MyChart">
<chartingToolkit:BarSeries Title="Sales" ItemsSource="{Binding}" IndependentValuePath="Name" DependentValuePath="Value" AnimationSequence="FirstToLast" TransitionDuration="00:00:3">
<chartingToolkit:BarSeries.TransitionEasingFunction>
<BounceEase EasingMode="EaseInOut" Bounciness="5" />
</chartingToolkit:BarSeries.TransitionEasingFunction>
<chartingToolkit:BarSeries.DataPointStyle>
<Style TargetType="Control">
<Setter Property="Background" Value="Red"/>
</Style>
</chartingToolkit:BarSeries.DataPointStyle>
</chartingToolkit:BarSeries>
<chartingToolkit:Chart.Axes>
<chartingToolkit:LinearAxis Title="Types owned" Orientation="X" Minimum="0" Maximum="300"
Interval="10" ShowGridLines="True" FontStyle='Italic'/>
</chartingToolkit:Chart.Axes>
</chartingToolkit:Chart>
</Grid>
code behind
public class MyClass : DependencyObject
{
public string Name { get; set; }
public Double Value {
get { return (Double)GetValue(myValueProperty); }
set{SetValue(myValueProperty,value);}
}
public static readonly DependencyProperty myValueProperty =
DependencyProperty.Register("Value", typeof(Double), typeof(MyClass), null);
}
public MainPage()
{
InitializeComponent();
//Get the data
IList<MyClass> l = this.GetData();
//Get a reference to the SL Chart
MyChart.DataContext = l.OrderBy(e => e.Value);
//Find the highest number and round it up to the next digit
DispatcherTimer myDispatcherTimer = new DispatcherTimer();
myDispatcherTimer.Interval = new TimeSpan(0, 0, 0, 5, 0); // 100 Milliseconds
myDispatcherTimer.Tick += new EventHandler(Each_Tick);
myDispatcherTimer.Start();
}
public void Each_Tick(object o, EventArgs sender)
{
((BarSeries)MyChart.Series[0]).DataContext = GetData();
}
private IList<MyClass> GetData()
{
开发者_JS百科 Random random = new Random();
return new List<MyClass>()
{
new MyClass() {Name="Bob Zero",Value=(random.NextDouble() * 100.0)},
new MyClass() {Name="Bob One",Value=(random.NextDouble() * 100.0)},
new MyClass() {Name="Bob Two",Value=(random.NextDouble() * 100.0)},
new MyClass() {Name="Bob Three",Value=(random.NextDouble() * 100.0)}
};
}
The name BounceEase refers to how the value being animated is varied over the time of the animation. The BounceEase varies the value as you might imagine like a ball bouncing. The graphs in the documentation describe it.
The key point is that ultimately animations simply vary a value they don't really understand what the visual effect of varing the value is. In this case the value being animated is the DataPoint opacity. Hence with a bounce ease it appears to fade in a little then fade away then then fade a litte more and so on until it has completely faded in.
It would take quite a bit more work creating a new template for the DataPoint to get the effect you are after.
精彩评论