jQuery(function(){ function weekendAreas(axes) { var markings = []; var d = new Date(axes.xaxis.min); // go to the first Saturday d.setUTCDate(d.getUTCDate() - ((d.getUTCDay() + 1) % 7)) d.setUTCSeconds(0); d.setUTCMinutes(0); d.setUTCHours(0); var i = d.getTime(); do { // when we don't set yaxis, the rectangle automatically // extends to infinity upwards and downwards markings.push({ xaxis: { from: i, to: i + 2 * 24 * 60 * 60 * 1000 } }); i += 7 * 24 * 60 * 60 * 1000; } while (i < axes.xaxis.max); return markings; } var order_data = jQuery.parseJSON( params.order_data.replace(/"/g, '"') ); var d = order_data.order_counts; var d2 = order_data.order_amounts; for (var i = 0; i < d.length; ++i) d[i][0] += 60 * 60 * 1000; for (var i = 0; i < d2.length; ++i) d2[i][0] += 60 * 60 * 1000; var placeholder = jQuery("#placeholder"); var plot = jQuery.plot(placeholder, [ { label: "Number of sales", data: d }, { label: "Sales amount", data: d2, yaxis: 2 } ], { series: { lines: { show: true }, points: { show: true } }, grid: { show: true, aboveData: false, color: '#ccc', backgroundColor: '#fff', borderWidth: 2, borderColor: '#ccc', clickable: false, hoverable: true, markings: weekendAreas }, xaxis: { mode: "time", timeformat: "%d %b", tickLength: 1, minTickSize: [1, "day"] }, yaxes: [ { min: 0, tickSize: 10, tickDecimals: 0 }, { position: "right", min: 0, tickDecimals: 2 } ], colors: ["#8a4b75", "#47a03e"] }); placeholder.resize(); function showTooltip(x, y, contents) { jQuery('