Skip to main content
deleted 5 characters in body
Source Link
Negi Rox
  • 211
  • 3
  • 9

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.OrgChartBar(document.getElementById(DivID));
                chart.draw(data, { allowHtml: true });
            }
        }
    });
</script>
<div id="chart_div"></div>

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.OrgChart(document.getElementById(DivID));
                chart.draw(data, { allowHtml: true });
            }
        }
    });
</script>
<div id="chart_div"></div>

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>
added 4 characters in body
Source Link
Negi Rox
  • 211
  • 3
  • 9

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(urldataURL, function (data) {
        var dataFromSharepointList = data.value;
        var ChartDatadataFromSharepointList = [];data.value;
        $.each(ChartData, function (key, value) {
            data.addRowdrawChart([value.ProductdataFromSharepointList, value.Quantity]"chart_div");
        });
        drawChart(ChartData, "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');
            data    $.addRowseach(ChartData, function (key, value) {
                    data.addRow([value.Product, value.Quantity]);
                });
                var chart = new google.visualization.OrgChart(document.getElementById(DivID));
                chart.draw(data, { allowHtml: true });
            }
        }
    });
</script>
<div id="chart_div"></div>

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(url, function (data) {
        var dataFromSharepointList = data.value;
        var ChartData = [];
        $.each(ChartData, function (key, value) {
            data.addRow([value.Product, value.Quantity]);
        });
        drawChart(ChartData, "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');
            data.addRows(ChartData);
            var chart = new google.visualization.OrgChart(document.getElementById(DivID));
            chart.draw(data, { allowHtml: true });
        }
    }
 });
</script>
<div id="chart_div"></div>

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.OrgChart(document.getElementById(DivID));
                chart.draw(data, { allowHtml: true });
            }
        }
    });
</script>
<div id="chart_div"></div>
Source Link
Negi Rox
  • 211
  • 3
  • 9

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(url, function (data) {
        var dataFromSharepointList = data.value;
        var ChartData = [];
        $.each(ChartData, function (key, value) {
            data.addRow([value.Product, value.Quantity]);
        });
        drawChart(ChartData, "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');
            data.addRows(ChartData);
            var chart = new google.visualization.OrgChart(document.getElementById(DivID));
            chart.draw(data, { allowHtml: true });
        }
    }
 });
</script>
<div id="chart_div"></div>