2016-08-31 4 views
0

pdark와 html flexdashboard를 생성하는 RMarkdown 파일에 작성중인 테이블에 패딩을 추가하려고합니다. 나는 내가 사용할 수있는 많은 함수/패키지 (pander, xtable, DT 등)가 있음을 알고 있지만, knitr 패키지의 kable 함수를 사용하는 것을 선호한다.r knitr kable 패딩이 format = "html"로 작동하지 않습니다.

내가 겪고있는 문제는 패딩 인수가 작동하지 않는 것입니다. 내 문서에 맞춤 CSS를 추가하지 않고도이 문제를 해결할 수있는 도움을 주시면 감사하겠습니다.

예를 들어, 패딩을 0, 10, 20으로 설정하여 코드를 실행하려고했지만 html 파일에서 테이블이 모두 동일하게 보입니다.

knitr::kable(head(cars), format = "html", padding = 0) 
knitr::kable(head(cars), format = "html", padding = 10) 
knitr::kable(head(cars), format = "html", padding = 20) 

enter image description here

나는 knitr_1.14과 rmarkdown_1.0을 사용하고 다음과 같이 내 세션 정보입니다.

R version 3.3.0 (2016-05-03) 
Platform: x86_64-w64-mingw32/x64 (64-bit) 
Running under: Windows 7 x64 (build 7601) Service Pack 1 
+0

예에서 'html'형식과 조합하여 사용되는 패딩이 표시되지 않습니다. 하지만이 게시물을 기반으로 http://stackoverflow.com/questions/17717323/align-two-data-frames-next-to-each-other-with-knitr 당신은 시도 할 수 있습니다> kable (head (cars), format = ' html ', table.attr ='cellpadding = "10" ') –

+0

제안에 감사드립니다. 마틴처럼 나는 table.attr = 'cellpadding = "10"을 얻을 수 없습니다. – MCDAngelo

답변

4

옵션 table.attr='cellpadding="20px"'이 작동하지 않습니다. CSS 스타일을 사용하고 table.attr='class="myTable"'을 사용하여 클래스에 테이블을 추가하면 원하는 패딩 속성을 가진 모든 테이블로 연결됩니다 (단 하나의 테이블 만 새 클래스를 포함하는 경우에도 마찬가지입니다).

난 단지 내가 일반적으로 jQuery를 함께 할 것입니다 하나 개의 테이블을 수정하려면 :

--- 
title: "Table Cell Padding" 
output: html_document 
--- 

```{r} 
knitr::kable(head(cars), format = "html") 
``` 
```{r} 
knitr::kable(head(cars), format = "html", table.attr='class="myTable"') 
``` 
<style> 
    .myTable td { 
    padding: 40px; 
    } 
</style> 

enter image description here


또 다른 옵션은 개별 요소를 편집 할 jQuery를 사용하는 것입니다. 다음 예제는 위의 CSS 스타일과 동일한 방식으로 표를 수정합니다.

<script type="text/javascript"> 
    // When the document is fully loaded... 
    $(document).ready(function() { 
    // ... select the cells of the table that has the class 'myTable' 
    // and add the attribute 'padding' with value '20px' to each cell 
    $('table.myTable td').css('padding','20px'); 
    }); 
</script> 

여기서 수정하고자하는 테이블에 myTable 클래스를 추가합니다. 이후에 일부 JavaScript (주석 참조)를 실행합니다. 다른 방법으로 다른 CSS 속성 (예 : $('table.myTable').css(...))을 표 요소 ($('table.myTable td').css('background-color','red');)에 추가 할 수 있습니다.

+0

CSS 또는 JavaScript를 추가하지 않으려 고하지만 이것이 기본 표 속성을 덮어 쓰는 유일한 방법 인 것처럼 보입니다. 예를 들어 주셔서 감사합니다! – MCDAngelo

관련 문제