Question

已解决：时间线图表与bootstrap span类没有很好的协作。以错误的顺序调试并以代码开始，而不是标记。

Google charts处的时间线示例均显示底部带有时间标记的时间轴。但是，我无法让它们出现，而且文档从未提及它们，让我觉得它们在某些时候是默认的，但不再是。页面上的示例都是图像，因此它们不是由当前的API生成的。

以前有人在解决这个问题吗？

编辑：我应该注意，标记中出现一行，隐藏并包含看起来像单个标记的内容（：10）。另外，根据要求，这里有一些代码。这是一个Rails应用程序，时间轴的数据是通过AJAX获取的。也许这与它有关。与datetime相关的代码用于从Ruby转换为JavaScript格式的时间。最后一行隐藏了一个不断显示的滚动条：

我已经排除了数据的问题，因为如果我为示例中提供的那个（相同的参数）切换了我的dataTable.addRows（）调用，它仍然无法工作。

$(document).ready(function(){
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var rows_for_timeline = [[]];
        var length = 0;
        $.ajax({
            url: '/timelineevents.json',
            dataType: 'json',
            async: false,
            data: { operation_id: <%= @op.id %> }, 
            success: function(data){
              rows_for_timeline = data.timeline;
              length = rows_for_timeline.length;
              for(var i = 0; i < rows_for_timeline.length; i++){
                //Convert from ruby to javascript time
                var s_date = new Date(rows_for_timeline[i][2]*1000);
                var e_date = new Date(rows_for_timeline[i][3]*1000);
                rows_for_timeline[i][2] = new Date(s_date.getFullYear(), s_date.getMonth(), s_date.getDate(), s_date.getHours(), s_date.getMinutes(), s_date.getSeconds());
                rows_for_timeline[i][3] = new Date(e_date.getFullYear(), e_date.getMonth(), e_date.getDate(), e_date.getHours(), e_date.getMinutes(), e_date.getSeconds());
                }
              }
        });
        if(length > 0){
            var timeline = $('#timeline')[0];
            var chart;
            chart = null;
            chart = new google.visualization.Timeline(timeline);

            var dataTable = new google.visualization.DataTable();
            dataTable.addColumn({ type: 'string', id: 'Role' });
            dataTable.addColumn({ type: 'string', id: 'Name' });
            dataTable.addColumn({ type: 'date', id: 'Start' });
            dataTable.addColumn({ type: 'date', id: 'End' });
            dataTable.addRows(rows_for_timeline);

            var options = {
              timeline: { groupByRowLabel: true }
            };

            chart.draw(dataTable, options);
            //Fix scroll bar at the end.
          $("#timeline").children().first().children().first().children().first().siblings().first().css("overflow-y", "visible");
        }
    }
});

在Google图表时间轴下方显示时间标签

0 个答案: