.&1|?" {}:+dq8mQk?y@&*[3)Zص>Y=<4̲GЏh<"_p@~`L5 0LN-<|s5 r͠nWOy:3h0Ľ-^}zIWs TLyZܼ9ZoE%ûSg:hpL!ܰC liu|fL0G+>.$>P~ $i%S4f] |{E3ޠ(/Y@_P)>Z<5c 60ӦA+~fW^Ť76H\'cC Nw%={ve1mnZxRE`Ҵpz s=p3 q>KެcMюPJᛮbUC0(!jJCcYiuDv_/A|#4/]]Uw`#vɩퟙ0 7A&.'Wr*W:#.K6&gBoǿ?etve1mnZxRE`Ҵpz:6"Y[:^E;H"82P^*vT@hE _K#ضe%5^ĴM[:;,{mXY⮃bQ>?qQI^ZNAsqɾ:3u`{:X?4} w7T%6+Yu55PUu g]Dk{;(Yw2m *])6"Jֻ 5Aye5[tqO0ZΥ15=%GV**fV̂PI3M~ TQ͙|ѓw-$B j&9)ֈK1UC*Op318cg#v"C!gtLfiB)=S]+93-@M(uHmn#{wc,CoFMlAVj~ׂ&M|X?ِ$3L?#bck+˕ušoUME VSg:hpL&3_{eRͅY"<\ׄڴ8z?.+q2]aovw?\wpۅGf|+Cl*ioHcM155ۄCf+#9笴p?˖bĭ~ 8CXYYx`'W'Ojzz; eax/ M~[&הz^Kwϓ8nn&,`\f}ԋ|PX$s~YXMg 8nn&,`\fPrhĆY,[5-*8nn&,`\fF˾=TshbgWť72^FpG]=1xɷҢ"\O/Jq@8a_@y{[-Ċ6Iwvp-}f/IfU ԘGx/;ɸZɽFeoe8<oe  /\N9zqXccZ~ObcIї:sĭ%5 Hi*2ɣDQP^NΆ* h4EЦlS`k6=مk^[%A4j(8 QotaOyuJϒ"&?T 4k_:=xe!/yPͣ2#Lb\!{j +^niC&8nn&,`\f&jR u~G{.:SPxgJ:9?[їn;Gx,ʺLΖL|A:8nn&,`\f ohx[mw# 98nn&,`\f `np^g3̩ϛ]_GA nͻ@3\˕+ZKgkcenKNRDQP^NΆ* h44)+:*n;sc{96vfag2,8nn&,`\f^ `Nb8l8nn&,`\f6%VM(28nn&,`\f8nn&,`\f'5{*8nn&,`\f<"h dn=l>ZU{79M(8nn&,`\f8nn&,`\fjM. ;2EmZZ2S9|g:3.H8nn&,`\f8nn&,`\f5 =YbyVD8nn&,`\f8nn&,`\f;[ET*(5avOS\'J 8nn&,`\f8nn&,`\f.w;VX!ĭRN8'0aTV8nn&,`\f)VFY8nn&,`\f6x8%{ťaX8nn&,`\f}Yʤ=ő7R~Z=T x,Ͼ2;b?ޒPd/?,Ly>ea&MٳFB=u8#d76W|b;t}-w[ڴnpk#a,'~glͱ 8<#`HgU;r*2sg6u ?HLe<"s@aEuO䆚6pO 3CDO VG*"v)I:=L/P7rlC*.|DqLd6=M=zQJO`Ҽ7 X0ܩ*g~:jBڽz-NX| bɝ&(,yq0^i7_?kRh>5'&0qrAҔ hX.!B/ֱAK֚㋺xI"-cFCĶM7{;t>7ř1X-- Rh9\JU|Σ"%"m'$ [4cV&A*ꕺzMDm+~2'7B\DCI! qGMEb+Fq(æ%[mةfcL(#(>1n)Tk9D> rf&!ufNWʘ ZJP k DQP^NΆ* h4\z8t(:`"-cFCĶǒAJ7%H@;]LtWMudDN)(4kWU|J`02o&kEw0c,= ^J}EO#,Yp>Za*5+]EUqړ6l*;7i }; var targetBarGaugeDataAdapter = new $.jqx.dataAdapter(targetBarGaugeSource, { loadComplete: function (records) { var values = []; for (var i = 0; i < records.length; i++) { values.push(records[i].value); } $('#jqxbargauge').jqxBarGauge({ values: values }); }, loadError: function () { alert('Server is not responding (BarGauge)'); } }); targetBarGaugeDataAdapter.dataBind(); //Column Chart source = { datatype: 'json', datafields: [ { name: 'Product' }, { name: 'Sales' }, { name: 'av' } ], url: 'data.php?usedwidget=popularproductschart' }; dataAdapter = new $.jqx.dataAdapter(source, { async: false, autoBind: true, loadError: function (xhr, status, error) { alert('Error loading "' + source.url + '" : ' + error); } }); settings = { title: 'Product Popularity', description: 'per sold product', showLegend: false, enableAnimations: true, borderLineWidth: 0.5, padding: { left: 5, top: 5, right: 5, bottom: 5 }, titlePadding: { left: 0, top: 0, right: 0, bottom: 10 }, source: dataAdapter, xAxis: { dataField: 'Product', flip: false, gridLines: { visible: false } }, seriesGroups: [ { type: 'column', columnsGapPercent: 50, valueAxis: { title: { text: 'Amount

' }, gridLines: { visible: false } }, series: [ { dataField: 'Sales' } ], bands: [ { minValue: 1790, maxValue: 1790, fillColor: '#F1495B', lineWidth: 2, dashStyle: '2,2' } ], annotations: [ { type: 'rect', yValue: 1790, xValue: 6, offset: { x: -850, y: -25 }, width: 85, height: 20, fillColor: '#F1495B', lineColor: '#F1495B', text: { value: 'Average', fillColor: 'white', offset: { x: 15, y: 4 }, 'class': 'redLabel', angle: 0 } } ] } ] }; $('#jqxchart').jqxChart(settings); $('#jqxchart').jqxChart('addColorScheme', 'myScheme', ['#888D94']); $('#jqxchart').jqxChart('colorScheme', 'myScheme'); //Line Chart var revenuesSource = { datatype: 'json', datafields: [ { name: 'Month' }, { name: '2014' }, { name: '2015' }, { name: '2016' } ], url: 'data.php?usedwidget=revenueschart' }; var revenuesDataAdapter = new $.jqx.dataAdapter(revenuesSource, { async: false, autoBind: true, loadError: function (xhr, status, error) { alert('Error loading "' + source.url + '" : ' + error); } }); settings = { title: 'Monthly revenues', description: '(2014, 2015, 2016)', enableAnimations: true, showLegend: true, borderLineWidth: 0.5, padding: { left: 10, top: 10, right: 15, bottom: 10 }, titlePadding: { left: 90, top: 0, right: 0, bottom: 10 }, source: revenuesDataAdapter, xAxis: { dataField: 'Month', unitInterval: 1, tickMarks: { visible: true, interval: 1 }, gridLinesInterval: { visible: true, interval: 1 }, valuesOnTicks: false, padding: { bottom: 10 } }, valueAxis: { minValue: 1200, maxValue: 2500, title: { text: 'Revenues

' }, labels: { horizontalAlignment: 'right' } }, seriesGroups: [ { type: 'line', series: [ { dataField: '2014', symbolType: 'square', labels: { visible: true, backgroundColor: '#FEFEFE', backgroundOpacity: 0.2, borderColor: '#7FC4EF', borderOpacity: 0.7, padding: { left: 5, right: 5, top: 0, bottom: 0 } } }, { dataField: '2015', symbolType: 'square', labels: { visible: true, backgroundColor: '#FEFEFE', backgroundOpacity: 0.2, borderColor: '#7FC4EF', borderOpacity: 0.7, padding: { left: 5, right: 5, top: 0, bottom: 0 } } }, { dataField: '2016', symbolType: 'square', labels: { visible: true, backgroundColor: '#FEFEFE', backgroundOpacity: 0.2, borderColor: '#7FC4EF', borderOpacity: 0.7, padding: { left: 5, right: 5, top: 0, bottom: 0 } } } ] } ] }; $('#jqxchart1').jqxChart(settings); $('#jqxchart1').jqxChart('addColorScheme', 'myScheme', ['#F1495B', '#4d5866', '#888D94']); $('#jqxchart1').jqxChart('colorScheme', 'myScheme'); });

General Info

  • % of target for the year

  • % of target for the month

  • % of target for the week