JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://www.gstatic.com/charts/loader.js"></script>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
 <div id="chartdiv" style="width: 900px; height: 500px;"></div>

JavaScript

google.charts.load('current', { 'packages': ['corechart'] });

        //Call function after Google Chart is loaded, it is required, otherwise you may get error
        google.charts.setOnLoadCallback(DrawonLoad);


        function DrawonLoad() {
            var Data = [{ "Frequencies": "1" }, { "Frequencies": "2" }, { "Frequencies": "3" }];

            var freqNames = ["A", "B", "C"];
            var data = new google.visualization.DataTable();

            data.addColumn('string', 'DisplayName');
            data.addColumn('number', 'FreqValue');

            //Loop through each list data
            for (var i = 0; i < Data.length; i++) {

                data.addRow([freqNames[i], parseInt(Data[i].Frequencies, 10)]);
            }

            // Instantiate and draw our chart, passing in some options
            var chart = new google.visualization.PieChart(document.getElementById('chartdiv'));

            //Draw pie chart command with data and chart options
            chart.draw(data,
                {
                    title: "Google pie Chart in ASP.NET MVC",
                    position: "top",
                    fontsize: "14px",
                });

        }