2

我正在使用almende timeline.js为我的 Web 应用程序创建时间线。

这是时间线库

我想通过在双击范围时将用户发送到不同的 URL 来扩展timeline.js 库的功能，同时记住时间线设置为不可编辑。

这是我的js：

function drawVisualization(){

    var debug = 0;
    data = new google.visualization.DataTable();
    data.addColumn('datetime', 'start');
    data.addColumn('datetime', 'end');
    data.addColumn('string', 'content');
    data.addColumn('string', 'id');

    var options = {
        "width":  "100%",
        "height": "300px",
        "editable": false,
        "style": "box",
        //"min":  min_boundary,              
        "zoomMin": 1000 * 60 * 60 * 24,        
        "zoomMax": 1000 * 60 * 60 * 24 * 31 * 3
    };

    timeline = new links.Timeline(document.getElementById('mytimeline'));

    if(sugboals.length != 0){
        $.each(sugboals, function(index, value, tess) {
            //console.log('ID: ' + value.id + ' Start: ' + value.start + ' End: ' + value.end + ' Name: ' + value.name);
            start = dateTimeSplit(value.start);
            end = dateTimeSplit(value.end);
            data.addRows([[new Date(start.year,start.month,start.day), new Date(end.year,end.month,end.day), value.name, value.id]]);
        });
    }

    /*On Custom Double Click - Send the user to different page*/
    function getSelectedRow() {
        var row = undefined;
        var sel = timeline.getSelection();
        if (sel.length) {
            if (sel[0].row != undefined) {
                row = sel[0].row;
            }
        }
        return row;
    }

    var onDblClickNotEditable = function (event) {
        var row = getSelectedRow();
        var name = data.getValue(row, 2);
        var id = data.getValue(row, 3);
        console.log('Name: ' + name, 'Id: ' + id);
        window.open('http://www.newpage.com/view/'+ id +'/');
        timeline.draw(data);
    };
    /*Double Click End*/

    // Add event listeners
    google.visualization.events.addListener(timeline, 'link', onDblClickNotEditable);

    timeline.draw(data, options);
}

你能推荐任何这样做的方法吗？

谢谢

4

0 回答 0