title: how to animate jqplot bar chart like example
body: <p>Has anyone had any luck with this?</p>
  
  <p>I copied and pasted the <strong>exact</strong> example code here <a href="http://www.jqplot.com/deploy/dist/examples/barTest.html" rel="nofollow noreferrer">http://www.jqplot.com/deploy/dist/examples/barTest.html</a> into my text editor.  I added all the .js files and .css file required.  when I run the page in any browser, I am not seeing the bars or the animation.  I have looked at the source code on the above URL as well to see how it works.  Could someone tell me why I can the animated bar chart on the URL but not from my desktop?  What's different?  Here is the exact code I copied:</p>
  
  <pre><code>&lt;html&gt;
   &lt;title&gt;Untitled Document&lt;/title&gt;
  
  &lt;link rel="stylesheet" href="js/jquery.jqplot.min.css" type="text/css" /&gt;
  &lt;!--[if lt IE 9]&gt;&lt;script language="javascript" type="text/javascript" src="js/excanvas.min.js"&gt;&lt;/script&gt;&lt;![endif]--&gt;
  &lt;script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script language="javascript" type="text/javascript" src="js/jquery.jqplot.min.js"&gt;&lt;/script&gt;
  &lt;script language="javascript" type="text/javascript" src="js/excanvas.min.js"&gt;&lt;/script&gt;
  &lt;script language="javascript" type="text/javascript" src="plugins/jqplot.barRenderer.min.js"&gt;&lt;/script&gt;
  
  
  &lt;script&gt;
  
  $(document).ready(function(){
  
          $.jqplot.config.enablePlugins = true;
          var s1 = [2, 6, 7, 10];
          var ticks = ['a', 'b', 'c', 'd'];
  
          plot1 =  $.jqplot('chart1', [s1], {
              // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
              animate: !$.jqplot.use_excanvas,
              seriesDefaults:{
                  renderer:$.jqplot.BarRenderer,
                  pointLabels: { show: true }
              },
              axes: {
                  xaxis: {
                      renderer: $.jqplot.CategoryAxisRenderer,
                      ticks: ticks
                  }
              },
              highlighter: { show: false }
          });
  
          $('#chart1').bind('jqplotDataClick', 
              function (ev, seriesIndex, pointIndex, data) {
                  $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
              }
          );
      });
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="chart1" style="margin-top: 20px; margin-left: 20px;width: 300px; height: 300px; position: relative;"&gt;&lt;/div&gt;
  
  
  &lt;div&gt;&lt;span&gt;Moused Over: &lt;/span&gt;&lt;span id="info1"&gt;Nothing&lt;/span&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>here is what I see in the browser after running that code:</p>
  
  <p><img src="https://i.stack.imgur.com/sZqza.png" alt="enter image description here"></p>
  
  <p>Thanks</p>