Wijmo UI for the Web
animation Option
wijmo.chart.wijbarchart Namespace > options type : animation Option

The animation option determines whether and how the animation is shown. It defines the animation effect and controls other aspects of the widget's animation, such as duration and easing.

Set the enabled attribute to false in order to disable the animation effect. See Animation for more information about supported animation effects and easing.

Type: object

Default: {enabled: true, duration: 400, easing: "easeinCubic"}

Syntax
$(function () {
    
    // Get value
    var returnsValue; // Type:  wijmo.chart.chart_animation
    returnsValue = $(".selector").wijbarchart("option", "animation");
    
    // Set value
    var newValue; // Type:  wijmo.chart.chart_animation
    $(".selector").wijbarchart("option", "animation", newValue);
        
});
var animation : chart_animation;
Example
$("#barchart").wijbarchart({
    animation:{
        enabled:true,
        duration:1000
    }
});
Remarks

duration

The duration option defines the length of the animation effect in milliseconds.
Type: Number
Default: 400

easing

Sets the type of animation easing effect that users experience when the wijbarchart series loads on the page. For example, the wijbarchart series can bounce several times as it loads.
Type: String
Default: "easeInCubic"
Valid Values:
  • easeInCubic – Cubic easing in. Begins at zero velocity and then accelerates.
  • easeOutCubic – Cubic easing in and out. Begins at full velocity and then decelerates to zero.
  • easeInOutCubic – Begins at zero velocity, accelerates until halfway, and then decelerates to zero velocity again.
  • easeInBack – Begins slowly and then accelerates.
  • easeOutBack – Begins quickly and then decelerates.
  • easeOutElastic – Begins at full velocity and then decelerates to zero.
  • easeOutBounce – Begins quickly and then decelerates. The number of bounces is related to the duration, longer durations produce more bounces.

enabled

The enabled option determines whether to use an animation effect.


Type: Boolean 
Default: true

You can create custom easing animations using jQuery UI Easings.
See Also

Reference

options type
wijbarchart Method