Tengo 3 entradas y desde donde, al hacer clic en un botón, obtengo esos valores de entrada y creo un gráfico circular dinámico de visualización de Google que depende de esos valores. Hice como este código a continuación, pero no obtuve el resultado esperado

HTML

 <input type="text" name="BigHalo" id="BigHalo"> <input type="text" name="MediumHalo" id="MediumHalo"> <input type="text" name="SmallHalo" id="SmallHalo"> <button type="button" onclick="onclickChartValur()" >CLICK HERE</button> <div id="donutchart" style="width:380px; height:380px;"></div>

CÓDIGO DE ESCRITURA

 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load("current", {packages:["corechart"]}); google.charts.setOnLoadCallback(drawChart); function drawChart(BigHalo,MediumHalo,SmallHalo) { var data = google.visualization.arrayToDataTable([ ['Language', 'Speakers (in millions)'], ['Big Halo', BigHalo], ['Medium Halo', MediumHalo], ['Small Halo',SmallHalo] ]); var options = { legend: 'none', pieSliceText: 'label', title: '', pieStartAngle: 100, }; var chart = new google.visualization.PieChart(document.getElementById('donutchart')); chart.draw(data, options); } function onclickChartValur() { var BigHalo = $("#BigHalo").val(); var MediumHalo = $("#MediumHalo").val(); var SmallHalo = $("#SmallHalo").val(); drawChart(BigHalo,MediumHalo,SmallHalo); } </script>

RESULTADO DE ERRORES ::

RESULTADO ESPERADO