Я использую D3, чтобы нарисовать таблицу HTML, и все отлично работает при вводе. Когда я добавляю новый элемент в мою коллекцию данных, он правильно добавляет новый элемент в таблицу.

Проблема заключается в том, что каждый раз, когда я обновляю существующий объект (объект в коллекции backgroundJobs ниже) внутри коллекции. Когда я повторно запускаю код D3 для синхронизации таблицы, он не работает. Ничего не произошло.

Вот код:

var visibleColumns = ['Name', 'Start', 'End', 'Status', 'Metadata', 'Errors'];

var table = d3.select('#jobs').append('table');
var thead = table.append('thead');
var tbody = table.append('tbody');

thead.append("tr")
    .selectAll("th")
    .data(visibleColumns)
    .enter()
    .append("th")
    .text(function (column) { return column; });

function tick() {
    var rows = tbody.selectAll("tr")
        .data(backgroundJobs, function(d) {
            return d.name;
        })
        .enter()
        .append("tr");

    var cells = rows.selectAll("td")
        .data(function(row) {
            return [{column: 'Name', value: row.name},
                    {column: 'Start', value: row.startedTimestamp},
                    {column: 'End', value: row.endedTimestamp},
                    {column: 'Status', value: row.isRunning},
                    {column: 'Metadata', value: ''},
                    {column: 'Errors', value: row.errorMsg}];
        })
       .enter()
        .append("td")
        .text(function(d) { return d.value; });
}

setInterval(tick, 500);