I have a problem using jqPlot with JSF

I added this code to my JSF page:

$(document).ready(function () {
  var s1 = [200, 600, 700, 1000];
  var s2 = [460, - 210, 690, 820];
  var s3 = [-260, - 440, 320, 200];
  var ticks = ['May', 'June', 'July', 'August'];
  var plot1 = $.jqplot('chart1', [s1, s2, s3], {
    // The "seriesDefaults" option is an options object that will
    // be applied to all series in the chart.
    seriesDefaults: {
      renderer: $.jqplot.BarRenderer,
      rendererOptions: {
        fillToZero: true
      }
    },
    series: [{
      label: 'Hotel'
    }, {
      label: 'Event Regristration'
    }, {
      label: 'Airfare'
    }],
    legend: {
      show: true,
      placement: 'outsideGrid'
    },
    axes: {
      xaxis: {
        renderer: $.jqplot.CategoryAxisRenderer,
        ticks: ticks
      },
      yaxis: {
        pad: 1.05,
        tickOptions: {
          formatString: '$%d'
        }
      }
    }
  });
});

but when I try to load the page I got this error :

Uncaught TypeError: Cannot read property 'BarRenderer' of undefined
(anonymous function)portfolioModeling.xhtml:184
f.extend._Deferred.e.resolveWithjquery.min.js:2
e.extend.readyjquery.min.js:2
c.addEventListener.C

I added the whole required js files and also the css file but I am lost and don't know where is the problem

Thanks in advance