Javascript 谷歌图表停止工作-未捕获错误：第14行有2列，但必须有4列

编辑：我的一些原始数据似乎不包含三个堆叠条中每个条的值。这是有效的，并基于用户选择。例如：餐厅可能只有早餐菜单，但没有三明治或便餐（见下文）

谷歌图表在这一行出现了问题，因为（有效）缺失的用户选择没有零的物理条目

是否存在谷歌图表设置，即“缺失值”被视为零值

下面是JSON输入的一个示例：

   [{"store_name":"Store 1","dish_menu":"Breakfast","dish_count":"13"},
    {"store_name":"Store 1","dish_menu":"Light Meals","dish_count":"7"},
    {"store_name":"Store 1","dish_menu":"Sandwiches","dish_count":"7"},
    {"store_name":"Store 2","dish_menu":"Breakfast","dish_count":"13"},
    {"store_name":"Store 2","dish_menu":"Light Meals","dish_count":"7"},
    {"store_name":"Store 2","dish_menu":"Sandwiches","dish_count":"7"},
    {"store_name":"Store 3","dish_menu":"Breakfast","dish_count":"13"},   <-- FAILS HERE
    {"store_name":"Store 4","dish_menu":"Breakfast","dish_count":"13"},
    {"store_name":"Store 4","dish_menu":"Light Meals","dish_count":"7"},
    {"store_name":"Store 4","dish_menu":"Sandwiches","dish_count":"7"},]

---

问题不是可视化API不知道如何处理缺少的值，而是您没有向DataTable构造函数提供完整的结构。

jsonData

变量包含如下数组：

[
    ['Menus', 'Breakfast', 'Light Meals', 'Sandwiches']
    ['Store 1', 13, 7, 7],
    ['Store 2', 13, 7, 7],
    ['Store 3', 13],
    ['Store 4', 13, 7, 7]
]

构造函数要求每行的列数与DataTable的列数相同（在本例中，由标题行定义）。如果替换此行：

var result = [key];

有了这些：

var result = new Array(header.length).map(function () {return null;});
result[0] = key;

数组的长度都是正确的，在没有任何值的地方填充空值。这个图表应该画得很好

对于API加载，将对

google.load的三个调用替换为一个调用：

google.load('visualization', '1', {'packages':['corechart'], callback: function () {
    drawChartDishMix();
    drawChartMenuMix();
    drawChartStoreMix();
}});

问题不是可视化API不知道如何处理缺少的值，而是您没有向DataTable构造函数提供完整的结构。
jsonData
变量包含如下数组：

[
    ['Menus', 'Breakfast', 'Light Meals', 'Sandwiches']
    ['Store 1', 13, 7, 7],
    ['Store 2', 13, 7, 7],
    ['Store 3', 13],
    ['Store 4', 13, 7, 7]
]

构造函数要求每行的列数与DataTable的列数相同（在本例中，由标题行定义）。如果替换此行：

var result = [key];

有了这些：

var result = new Array(header.length).map(function () {return null;});
result[0] = key;

数组的长度都是正确的，在没有任何值的地方填充空值。这个图表应该画得很好

对于API加载，将对
google.load的三个调用替换为一个调用：

google.load('visualization', '1', {'packages':['corechart'], callback: function () {
    drawChartDishMix();
    drawChartMenuMix();
    drawChartStoreMix();
}});

首先，您应该有一个对
google.load
的调用，该调用只有一个回调。此回调函数可以调用所有图表绘制函数。第二，你能用
json
的完整副本更新你的问题吗？考虑到小样本，我能够毫无问题地复制图表。您好，asgallant，谢谢您的回复。三个google.load调用的原因是每个调用的回调中都呈现了三个图表。页面位于uid/pwd后面。你介意看一下这一页，看看你认为是什么问题吗？我该如何私下和你联系（我在这个论坛上是新手！）。谢谢@因此，这里没有办法直接向人们传达信息，我们的目标是为未来的访问者留下好的资源。如果可能的话，你能试着用一个编辑工具来编辑你的代码，找出问题的核心，这样我们就可以重现它吗？这将以最快的速度为您提供答案。嗨@jmac，谢谢。我已经弄明白了为什么会这样（见上文）。谷歌图表在工作方式上似乎很笨拙（这是我第一次使用它）。我上面的问题有解决办法吗？谢谢我不是专家（@asgallant在这里扮演这个角色），但如果您只为缺少的项目添加空白（或零）值，这似乎是可以解决的。如果您尝试将两个零值行添加到Store 3的示例中（对于便餐和三明治），结果应该很好。如何添加它取决于您所获取的数据的结构。首先，您应该有一个对
google.load的调用，该调用只有一个回调。此回调函数可以调用所有图表绘制函数。第二，你能用
json
的完整副本更新你的问题吗？考虑到小样本，我能够毫无问题地复制图表。您好，asgallant，谢谢您的回复。三个google.load调用的原因是每个调用的回调中都呈现了三个图表。页面位于uid/pwd后面。你介意看一下这一页，看看你认为是什么问题吗？我该如何私下和你联系（我在这个论坛上是新手！）。谢谢@因此，这里没有办法直接向人们传达信息，我们的目标是为未来的访问者留下好的资源。如果可能的话，你能试着用一个编辑工具来编辑你的代码，找出问题的核心，这样我们就可以重现它吗？这将以最快的速度为您提供答案。嗨@jmac，谢谢。我已经弄明白了为什么会这样（见上文）。谷歌图表在工作方式上似乎很笨拙（这是我第一次使用它）。我上面的问题有解决办法吗？谢谢我不是专家（@asgallant在这里扮演这个角色），但如果您只为缺少的项目添加空白（或零）值，这似乎是可以解决的。如果您尝试将两个零值行添加到Store 3的示例中（对于便餐和三明治），结果应该很好。如何添加它取决于您所获取的数据的结构。嗨@asgallant，GENIUS，谢谢！！为我节省了最后一根头发和理智（以及一吨时间！），并学到了一些新东西。嗨@asgallant，天才，谢谢！！节省了我最后的头发和理智（以及一吨的时间！）并学到了一些新东西。