Javascript 谷歌图表错误-韩元'；t显示第二个图形

我试图在我的页面中集成多个图表，但只有第一个有效

JS代码如下所示：

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

function drawChart_total() {
var fixed_costs = document.getElementById('total_fixed_costs').value;
var variable_costs = document.getElementById('total_variable_costs').value;
var salary = document.getElementById('total_salary').value;     

var data = new google.visualization.DataTable();
data.addColumn('string','Cost Type');
data.addColumn('number','Spendings');
data.addRows
([
   ['Fixed Costs', parseFloat(fixed_costs)],
   ['Variable Costs', parseFloat(variable_costs)],
   ['Salary', parseFloat(salary)]
]);
var options = {title: 'Total costs distribution chart', width: 600, height: 333};
var chart = new google.visualization.PieChart(document.getElementById('piechart_total'));
chart.draw(data, options);
}

function drawChart_fixed() {
var truck_payment = document.getElementById('truck_payment').value;
var collision_comp_insurance =  document.getElementById('collision_comp_insurance').value;
var office_lease = document.getElementById('office_lease').value;   
var health_insurance = document.getElementById('health_insurance').value;   
var permits = document.getElementById('permits').value;

var data = new google.visualization.DataTable();
data.addColumn('string', 'Cost Type');
data.addColumn('number', 'Spendings');
data.addRows
([
   ['Truck Payment', parseFloat(truck_payment)],
   ['Collision / Comp Insurance', parseFloat(collision_comp_insurance)],
   ['Office Lease', parseFloat(office_lease)]
   ['Health Insurance', parseFloat(health_insurance)],
   ['Permits', parseFloat(permits)]
]);
var options = {title: 'Fixed costs distribution chart', width: 600, height: 333};
var chart = new google.visualization.PieChart(document.getElementById('piechart_fixed'));
chart.draw(data, options);
}

数据来自一个表单。 第一个图形的表单字段的HTML标记如下所示：

<input name="total_fixed_costs" id="total_fixed_costs" placeholder="Total" value=0 readonly>

<input type="number" min=0 id="permits" name="permits" placeholder="Write Here">

第二张图的图是这样的：

<input name="total_fixed_costs" id="total_fixed_costs" placeholder="Total" value=0 readonly>

<input type="number" min=0 id="permits" name="permits" placeholder="Write Here">

就第二张图而言，如果我保持原样，则会出现以下错误：

jsapi_compiled_default_module.js:36未捕获错误：给定的每一行必须为null或数组

另一方面，如果不对填充数据表第二列的变量使用parseFloat，则会出现以下错误：

jsapi_编译的_默认_module.js:14未捕获错误：类型不匹配。值与列索引1中的类型编号不匹配

在过去的两天里，我一直在寻找解决方案，但没有成功。我想说的是，我是编程界的新手，目前正在学习JS。我还没有与JQuery取得联系

---

多谢各位

首先，有一个打字错误

保持原样，意思是使用

parseFloat

及

在此行末尾添加逗号（

，

）

---

['Office Lease'，parseFloat（Office_Lease）]，//非常感谢

那个打字错误真让我受不了。我看了一遍又一遍，但没有看到它。根据您的指示，我还修改了图表脚本的第一部分

我必须将HTML标题更改为：

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>



根据谷歌图表网站上的说明（用于在同一页面上显示多个图表），我最初只有第一行

现在它就像一个符咒：）