У меня есть фрейм данных под названием df, и я использую формат html в Rmarkdown для создания фрейма данных, но из-за разного размера ячеек цвет фона не заполняется точно в ячейке, и у меня есть пробелы.
Код, который я использую:
df = structure(list(projects = c("Restaurant, Pizzeria and Pasta House Works for New York",
"London Project - New Restaurant Project",
"Athens - Beautiful Lands for Aigaleo City Project",
"Berlin City - Exhibition near the airport with restaurants",
"Pizzeria Buenos Aires New italian restaurant - pasta, tartufo and vino",
"area mean value", "total mean value"),
happiness.and.joyfullness = c(3.5,4, 3, 3.2, 4, 5, 3),
joy.for.children = c(3, 5, 3, 4, 5,4, 4),
area = c(3, 5, 3, 3, 3, 4, 4),
damages.from.environment = c(2,4, 2, 3, 3, 5, 5),
approach = c(3, 1, 5,3, 5, 5, 4),
expensive = c(3, 5, 3, 4, 5, 5, 5),
safety.comes.first = c(5,5, 5, 5, 5, 5, 4),
hungry = c(3, 5, 2, 4, 5,5, 5)),
row.names = c(NA, -7L),
class = c("tbl_df", "tbl","data.frame"))
set_background = function(x, color = "white") {
kableExtra::cell_spec(x,
bold = TRUE,
align = "center",
color = "black",
background = color,
extra_css = "align-items: center;
justify-content: center;margin: -5px; padding: 15px; display: flex;",
background_as_tile = FALSE
)}
set_background2 = function(x, color = "black") {
kableExtra::cell_spec(x,
bold = TRUE,
color = "black",
background = color,
extra_css = "align-items: center;
justify-content: center;margin: -5px; padding: 10px; display: flex;",
background_as_tile = FALSE)
}
df %>%
dplyr::mutate( across(projects, \(x) case_when(projects == "area mean value" ~set_background2(x, "yellow") ,
projects == "total mean value" ~set_background2(x, "yellow"),
TRUE ~ projects)))%>%
dplyr::mutate(
across(happiness.and.joyfullness:hungry, \(x)
case_when(
x <= 3.5 ~ set_background(x, "lightblue"),
x > 3.5 & x <= 4.5 ~ set_background(x, "pink"),
x > 4.5 & x <= 5 ~ set_background(x, "purple"),
TRUE ~ set_background(x))))%>%
kableExtra::kbl(align = "c",position = "center",caption = "Project Scoring Table", escape=FALSE)%>%
kableExtra::kable_paper()%>%
kableExtra::row_spec(0,color = "white", background = "grey")%>%
kableExtra::column_spec(1:9,
bold = TRUE,
border_left = TRUE,
border_right = TRUE)%>%
kableExtra::row_spec(0:7, align = "center",extra_css = "vertical-align:middle;")
в результате:
как я могу исправить это в R для html-документа Rmarkdown? Я просто играю с заполнением и полями и делаю вещи все больше и больше. Проблема в том, что пробелы появляются, когда я визуализирую их в html через rmarkdown.
Проверка вывода HTML, сгенерированного kableExtra, показывает, что содержимое ячейки заключено в элементы span
.
<td style = "text-align:center;font-weight: bold;border-left:1px solid;border-right:1px solid;text-align: center;vertical-align:middle;">
<span style = "font-weight: bold; color: black !important;padding-right: 4px; padding-left: 4px; background-color: pink !important; align-items: center; justify-content: center; margin: -5px; padding: 15px; display: flex; text-align: center;">
4
</span>
</td>
Из-за особенностей отображения строк и ячеек HTML-таблицы span
не может определить высоту элемента родительской ячейки, поэтому простая установка высоты на 100 % не будет иметь никакого эффекта. Вы можете установить для высоты фиксированное значение, например 150px
, но это будет означать, что любые ячейки с очень длинным содержимым будут иметь переполненное содержимое.
Заставить внутреннюю span
заполнить содержащую ее ячейку таблицы на удивление сложно, как показали предыдущие вопросы. В этом случае, вероятно, самым простым способом было бы установить position: relative
для каждого элемента td
и position: absolute
для каждого элемента span
. Затем мы можем установить свойства top
, right
, bottom
и left
span
на 0, заставляя их перекрывать всю ячейку.
Из приведенного выше HTML-кода мы видим, что стили, которые вы передаете от extra_css
до kableExtra::cell_spec
(в функции set_background
), применяются к span
. И кажется, что стили, переданные kableExtra::row_spec
, применяются ко всем td
. Таким образом, мы сможем изменить положение td
и span
, используя row_spec
и cell_spec
соответственно.
Итак, чтобы задать относительное позиционирование каждого элемента td
, обновите extra_css
в вызове до row_spec
в последней строке.
kableExtra::row_spec(
0:7,
align = "center",
extra_css = "
vertical-align: middle;
position: relative;
"
)
А чтобы придать span
абсолютное позиционирование, обновите extra_css
в вызове cell_spec
в вашей set_background
функции. Вы также можете удалить отрицательный запас.
set_background = function(x, color = "white") {
kableExtra::cell_spec(
x,
bold = TRUE,
align = "center",
color = "black",
background = color,
extra_css = "
align-items: center;
justify-content: center;
padding: 15px;
display: flex;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
",
background_as_tile = FALSE
)
}
Это дает следующий результат:
спасибо за разъяснения в начале. Я считаю это очень полезным. Когда я запускаю код вашего решения, последние две ячейки в первом столбце (желтые ячейки) перекрывают друг друга.