jQuery Plugin For Animated Flot Chart - Flot Animator
File Size: | 30.8KB |
---|---|
Views Total: | 5411 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Flot Animator is a jQuery plugin worked with Flot Chart Plugin that will add a fluid startup animation to any Flot chart. It will allow you to highlight and draw attention to some charts and/or series by easily adding animation to your existing charts.
How to use it:
1. Include jQuery javascript library and jQuery flot chart plugin in the head section of your page.
<script src="http://code.jquery.com/jquery-latest.min.js"></script> <script src="jquery.flot.min.js" type="text/javascript"></script>
2. Include jQuery Flot Animator plugin on your web page, after jQuery library.
<script src="jquery.flot.animator.min.js" type="text/javascript"></script>
3. Create a container for a plot chart.
<div id="chart"></div>
4. Animate the plot chart.
<script type="text/javascript"> $(window).load(function () { var d8 = [[2, 5],[4, 8],[6, 2],[7, 5],[9,1],[10, 4],[12, 5],[13, 6],[14, 4]]; $.plotanimator($("#chart"), [{ data : d8, animator: { start: 100, steps: 99, duration: 1000, direction: "left" } }]); }); </script>
About Author:
Author: jQuery Flot Animator By Chtiwi Malek
Project Homepage: http://www.codicode.com/art/jquery_flot_animator.aspx
This awesome jQuery plugin is developed by codicode.com. For more Advanced Usages, please check the demo page or visit the official website.