<script type="text/javascript">
$(document).ready(function(){
    s1 = [<?= $s1 ?>];
    ticks = [<?= $ticks ?>];

    plot1 = $.jqplot('graph', [s1], {
		show: true,
		title: 'Clients Per Service (Top 5)',
		seriesDefaults:{
			renderer:$.jqplot.BarRenderer,
			pointLabels: { show: true },
			rendererOptions: {
				shadowOffset: 0,
				shadowDepth: 0,
				shadowAlpha: 0
			}
		},
		seriesColors: [ "#a0e3ab" ],
		grid: {drawBorder: false, background:'#fff', gridLineColor:'#ccc',shadow: false },
		axesDefaults: {},
		axes: {
			xaxis: {
				renderer: $.jqplot.CategoryAxisRenderer,
				labelOptions: {
					enableFontSupport: true,
					fontFamily: 'Arial',
					fontSize: '12pt'
				},
				ticks: ticks,
				label:'Service Name',
				autoscale: true,
				tickRenderer: $.jqplot.CanvasAxisTickRenderer,
				tickOptions: {
					angle: -30,
					fontSize: '11pt',
					enableFontSupport: true,
					fontFamily: 'Arial',
				}
			},
			yaxis: {
				label:'Number of Clients',
				autoscale: true,
				labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
				labelOptions: {
					enableFontSupport: true,
					fontFamily: 'Arial',
					fontSize: '12pt'
				}
			}
		},
		highlighter: { show: false }

    });