R datatable rowCallback с DT

Question

Я пытаюсь выполнить две различные операции форматирования на объекте с данными, используя пакеты DT и magrittr. Один использует вспомогательную функцию formatRound(), а другой передается как JavaScript в параметр rowCallback в функции datatable.

Когда я запускаю любую из операций форматирования отдельно, datatable отображает с ожидаемым форматированием. Однако, когда я оба вместе, datatable делает пустой, но я не получаю ошибку.

Этот код показывает поведение, которое я описываю.

library(magrittr) 
library(DT) 

df = data.frame(matrix(rnorm(20), nrow=10)) 

datatable(
    data = df 
) %>% 
    formatRound(c("X1", "X2"), 1) 

#table renders as expected 

datatable(
    data = df, 
    options = list(
    rowCallback = JS(" 
    function(row, data, index) { 
     if (index > 2) { 
     $(row).css('background-color', '#EDEDED'); 
     } 
     else if (index > 0) { 
     $(row).css('background-color', '#DEDEDE'); 
     } 
     else { 
     $(row).css('background-color', '#D3D3D3'); 
     } 
    }" 
    ) 
) 
) 

#table renders as expected 

datatable(
    data = df, 
    options = list(
    rowCallback = JS(" 
    function(row, data, index) { 
     if (index > 2) { 
     $(row).css('background-color', '#EDEDED'); 
     } 
     else if (index > 0) { 
     $(row).css('background-color', '#DEDEDE'); 
     } 
     else { 
     $(row).css('background-color', '#D3D3D3'); 
     } 
    }" 
    ) 
) 
) %>% 
    formatRound(c("X1", "X2"), 1) 

#table renders as blank but with no error returned 

Answer 1

Если вы посмотрите на функцию JS вашей третьей попытки в JS консоли браузера (нажмите на кнопку «Проверить опцию Element в браузере»), он показывает ошибку, говоря, что «вар» является неопознанным, потому что он находится вне области видимости функции JS:

(
var d = parseFloat(data[1]); $(this.api().cell(row, 1).node()).html(isNaN(d) ? '' : d.toFixed(1)); 
var d = parseFloat(data[2]); $(this.api().cell(row, 2).node()).html(isNaN(d) ? '' : d.toFixed(1)); 
    function(row, data, index) { 
     if (index > 2) { 
     $(row).css('background-color', '#EDEDED'); 
     } 
     else if (index > 0) { 
     $(row).css('background-color', '#DEDEDE'); 
     } 
     else { 
     $(row).css('background-color', '#D3D3D3'); 
     } 
    }) 

Если поместить эти две строки внутри функции JS, она прекрасно работает.

Вы можете найти обновленный код ниже.

datatable(
    data = df, 
    options = list(
     rowCallback = JS(" 
    function(row, data, index) { 
     var d = parseFloat(data[1]); 
     $(this.api().cell(row, 1).node()).html(isNaN(d) ? '' : d.toFixed(1)); 
     var d = parseFloat(data[2]); 
     $(this.api().cell(row, 2).node()).html(isNaN(d) ? '' : d.toFixed(1)); 
     if (index > 2) { 
     $(row).css('background-color', '#EDEDED'); 
     } 
     else if (index > 0) { 
     $(row).css('background-color', '#DEDEDE'); 
     } 
     else { 
     $(row).css('background-color', '#D3D3D3'); 
     } 
    }" 
     ) 
    ) 
)