Welcome to Software Development on Codidact!
Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.
Best practices for posting tabular data
I am trying to find how tabular data is presented in Software Development. So far, I have found one question, How to pivot text?. The question presents tabular data using code blocks, dash to indicate a new row, pipe to indicate column separation and underscore to indicate an empty cell. I took the data from the referred question and set none as the programming language to prevent the text from being highlighted:
- PERSON 1 | PERSON 2 | YES
- PERSON 1 | PERSON 3 | YES
- PERSON 2 | PERSON 1 | YES
- PERSON 2 | PERSON 3 | YES
- PERSON 3 | PERSON 1 | NO
- PERSON 3 | PERSON 2 | NO
and
- _________| PERSON 1 | PERSON 2 | PERSON 3 |
- PERSON 1 | X | YES | YES |
- PERSON 2 | YES | X | YES |
- PERSON 3 | NO | NO | X |
Sometimes, including the column and row headers on spreadsheet-formula questions might be relevant. Below I'm using dashes (-) and a plus (+) character between columns to separate the column headers from the data below:
| A | B | C
--+----------+----------+-----
1 | PERSON 1 | PERSON 2 | YES
2 | PERSON 1 | PERSON 3 | YES
3 | PERSON 2 | PERSON 1 | YES
4 | PERSON 2 | PERSON 3 | YES
5 | PERSON 3 | PERSON 1 | NO
6 | PERSON 3 | PERSON 2 | NO
It bugs me a bit that the space between lines looks to be too big.
- Is there a better way to present tabular data?
- Is there a way to reduce the space between lines?
3 answers
You are accessing this answer with a direct link, so it's being shown above all other answers regardless of its score. You can return to the normal view.
Some good options to consider:
- SQL
create table asstatements. This way you can define multiple tables all in one file, that can be copy/pasted easily. It also matches a very common thing: SQL exercises in things like Leetcode. - CSV. It's a bit ugly, but it's very easy to work with it, and many command line programs can take CSV right from standard input which in turn can come straight from the clipboard. So you don't even have to paste, just copy, and with a CLI it's very possible to post concise, readable and sophisticated solutions on a site like this. Even if you use a GUI, CSV pastes well into virtually every spreadsheet editor. And of course you can easily export anything to CSV.
- Markdown tables. If you can do CSV, you can use an online converter to turn it into Markdown easily. Markdown, unlike CSV, is much easier to read without formatting, and Calc etc. can take it from the clipboard if you use "fixed width". But it's also nice for people who are reading it by eye.
3 comment threads
I just found a post in Codidact Meta using showing a rendered table. Looking at the post content, it is using markdown.
Playing a bit, I found that the following "plain text" (intended to show markdown features, not to make it readable, maintainable, etc.)
| | | |
-|-|-
PERSON 1 | PERSON 2 | YES|
PERSON 1 | PERSON 3 | YES|
PERSON 2 | PERSON 1 | YES|
PERSON 2 | PERSON 3 | YES|
PERSON 3 | PERSON 1 | NO|
PERSON 3 | PERSON 2 | NO|
is rendered as follows:
Live demo:
| PERSON 1 | PERSON 2 | YES |
| PERSON 1 | PERSON 3 | YES |
| PERSON 2 | PERSON 1 | YES |
| PERSON 2 | PERSON 3 | YES |
| PERSON 3 | PERSON 1 | NO |
| PERSON 3 | PERSON 2 | NO |
Recently found related posts
Blog
- Newsletter #5 (December 2020) Mentions adding table support in the editor.
Feature requests
Markdown
HTML
For most purposes, the easiest approach is probably Markdown tables, as described in Wicket's answer.
If you have requirements that Markdown tables do not support, such as merged cells, you can resort to HTML tables, which can be included directly in the raw text of a post.
For example, raw text like this:
<table>
<thead>
<tr>
<th>header 1</th>
<th colspan="2">header 2 (wide)</th>
<th>header 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>data A</td>
<td colspan="2" rowspan="2">data B (wide tall)</td>
<td>data C</td>
</tr>
<tr>
<td rowspan="2">data D (tall)</td>
<td rowspan="1">data E</td>
</tr>
<tr>
<td>data F</td>
<td>data G</td>
<td>data H</td>
</tr>
</tbody>
</table>
Is rendered like this:
| header 1 | header 2 (wide) | header 3 | |
|---|---|---|---|
| data A | data B (wide tall) | data C | |
| data D (tall) | data E | ||
| data F | data G | data H | |
0 comment threads
2 comment threads