谷歌图表:无法阅读财产' datefield'未定义的

时间:2015-07-24 16:19:57

标签: javascript google-visualization

我还没有看到另一个人在Google Visualization中遇到同样的错误,所以我想我会在这里发帖。

错误发生在chart.draw()

这是图表的代码

                 if (google) {
                    google.load('visualization', '1', {
                        packages: ['corechart', 'controls', 'timeline'],
                        callback: function () {
                            var container = document.getElementById('timeline');
                            var chart = new google.visualization.Timeline(element[0]);
                            var dataTable = new google.visualization.DataTable();

                            dataTable.addColumn({ type: 'string', id: 'StatusMessage' });
                            dataTable.addColumn({ type: 'date', id: 'Start' });
                            dataTable.addColumn({ type: 'date', id: 'End' });

                            var rowsToAdd = [];
                            var colors = [];
                            for (var i = 0; i < statuses.length; i++) {
                                var elem = [];
                                elem.push(statuses[i].Message);
                                elem.push(new Date(statuses[i].StartDateUtc.substring(0, 10)));
                                elem.push(new Date(statuses[i].EndDateUtc.substring(0, 10)));
                                rowsToAdd.push(elem);
                                var intColor = statuses[i].StatusColor;
                                if (intColor == 0) {
                                    colors.push('#FF0000');
                                } else if (intColor == 1) {
                                    colors.push('#FFFF00');
                                } else if (intColor == 2) {
                                    colors.push('#00CC00');
                                } else {
                                    colors.push('#0000FF');
                                }
                            }

                            dataTable.addRows(rowsToAdd);
                            var heightToDraw = colors.length * 60;

                            chart.draw(dataTable, {
                                  colors: colors,
                                  height: heightToDraw
                            });
                        }
                    })
                }

我真的更好奇为什么会出现这个问题,然后我可以继续修复它。奇怪的是,我改变了输入数据的方式(即使数据完全相同),然后出现了这个问题。它可能是一个解析问题?

1 个答案:

答案 0 :(得分:1)

我遇到了类似的问题。根据{{​​3}},似乎谷歌可视化在某些情况下不能很好地使用引导程序存在问题(我不确定你是否就是这种情况,但我相当确定这是发生在我身上的事情)

我的图表放在一个div中:

<div id="timeline-div" class="col-sm-12 well"></div>

但是,当我从div中删除类时,例如:

<div id="timeline-div"></div>

然后图表显示就好了。将其中任何一个类或两者一起添加会导致错误再次出现。我目前正在寻找一种方法来引导合作。

编辑:所以我试着把我的课推上div来包装图表div,这似乎工作得很好:

<div class="col-sm-12">
    <div id="timeline-div">
        {{google visualization will put the chart here}}
    </div>
</div>