jquery - Jqplot not working with requirejs, jquerymobile, marionette -

i trying use jqplot jquery mobile, marionette , requirejs. have included jqplot required css script files in head tags, when trying plot chart using below code

define([ 'plot' ],      function() { console.log("success..inside offer page script."); console.log("plot..."+$.jqplot); $.jqplot.config.enableplugins = true; var s1 = [ 2, 6, 7, 10 ]; var ticks = [ 'a', 'b', 'c', 'd' ];  plot1 = $.jqplot('chart1', [ s1 ], {     seriesdefaults : {         renderer : $.jqplot.barrenderer,         pointlabels : {             show : true         }     },     axes : {         xaxis : {             renderer : $.jqplot.categoryaxisrenderer,             ticks : ticks         }     },     highlighter : {         show : false     } }); }); 

it gives me errors like

uncaught typeerror: undefined not function jqplot.barrenderer.js:41 (line 41: $.jqplot.barrenderer.prototype = new $.jqplot.linerenderer();)  uncaught typeerror: cannot call method 'push' of undefined jqplot.pointlabels.js:377 (line 377: $.jqplot.postseriesinithooks.push($.jqplot.pointlabels.init);) 

the plot in above code's define is

define([   '../scripts/ext_libs/jquery.jqplot', 'jquery' ], function () { var plot; require([     '../scripts/ext_libs/jqplot.barrenderer',     '../scripts/ext_libs/jqplot.pointlabels',     '../scripts/ext_libs/jqplot.categoryaxisrenderer',   ], function () {     plot = $.jqplot; }); return plot; 

} );

can please me how can solve these errors?

thanks in advance.

try using global configuration object instead, take @ 1 : https://github.com/davidsulc/structuring-backbone-with-requirejs-and-marionette/blob/master/assets/js/require_main.js

it's new book on marionette & requirejs (https://leanpub.com/structuring-backbone-with-requirejs-and-marionette), , declares jquery plugins (e.g. jquery ui).

have tried making plot have jquery dependency? looks that's issue.

you'll need config looking this:

requirejs.config({   paths: {     jquery: "path/to/jquery",     jqplot: "path/to/jqplot",     "jqplot.barrenderer": "path/to/jqplot.barrenderer",     "jqplot.pointlabels": "path/to/jqplot.pointlabels",     "jqplot.categoryaxisrenderer": "path/to/jqplot.categoryaxisrenderer"   },   shim: {     jqplot: ["jquery"],     "jqplot.barrenderer": ["jqplot"],     "jqplot.pointlabels": ["jqplot"],     "jqplot.categoryaxisrenderer": ["jqplot"]   } }); 

this indicates "jqplot" depends on jquery, , plugins depend on "jqplot". then, can have in code define plot:

define(['jqplot.barrenderer', 'jqplot.pointlabels', 'jqplot.categoryaxisrenderer'],function () {   return $.jqplot; }); 

this return jqplot property when plugins have been loaded. code can be:

define([ 'plot' ], function() {   console.log("success..inside offer page script.");   console.log("plot..."+$.jqplot); });