You need to just use this <script type="text/javascript" src="../SiteAssets/jquery-1.10.2.js"></script> <script type="text/javascript" src="../SiteAssets/jquery.SPServices-2014.02.min.js"></script> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> $(document).ready(function(){ var dataURL = _spPageContextInfo.webAbsoluteUrl + "/_api/Lists/getbyTitle('" + ListNamr + "')/Items?$top=5000&$select=Product,Quantity&$orderby Created desc"; $.getJSON(dataURL, function (data) { var dataFromSharepointList = data.value; drawChart(dataFromSharepointList, "chart_div") }); function drawChart(ChartData, DivID) { google.load("visualization", "1.0", { packages: ["bar"] }); google.charts.setOnLoadCallback(draw); function draw() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Product'); data.addColumn('string', 'Quantity'); $.each(ChartData, function (key, value) { data.addRow([value.Product, value.Quantity]); }); var chart = new google.visualization.Bar(document.getElementById(DivID)); chart.draw(data, { allowHtml: true }); } } }); </script> <div id="chart_div"></div>