ListSelector

Transtree table

demo：Describe the common angiosperms and gymnosperms

gymnosperm	Cypress	松树	油松
			罗汉松
			马尾松
			红松
	Ginkgo	柏树
	Angiosperms	银杏
angiosperm	Sunflower	向日葵
	Lotus	荷花
	Chrysanthemum	菊花

demo：Describe print statements for a variety of common programming languages

language	print	replenish
java	System.out.println("Hello World");	这语句有点长
c	printf("Hello World")	原始的C输出
c++	std::cout<<"Hello Wrold"	流输出，但是这东西开销大，竞赛党别用
python	print("Hello World")	需要注意一下Python2和Python3的打印语句不同
js	console.log("Hello World");	控制台打印

（Enable transposition）

Take this Chinese-English comparison table （@todo，At present is pure css implementation, complex will have bugs, waiting for js means to achieve in a real sense）

Cypress	松树
Ginkgo	柏树
Angiosperms	银杏
Sunflower	向日葵
Lotus	荷花
Chrysanthemum	菊花

Column Table/Tree Table (Foldable)

ListTable/TreeTable/TreeGrid

demo: Describe the company structure

name	superior department	principal	principal tel
ali group
Shanghai Company	开源集团	ZhangSan	13&xxxxxxxx
Marketing department	上海分公司	LiSi	14&xxxxxxxx
sub department 1
sub department 2
Sales department	上海分公司	WangWu	15&xxxxxxxx
Beijing Company	开源集团	ChenLiu	16&xxxxxxxx
Technology department	北京分公司	OuYang	17&xxxxxxxx
Accounting department	北京分公司	HuangPu	18&xxxxxxxx

Another way to write a list to a table

demo: Describe what you think of each of the following fruits

• < fruits
  • color
  • chinese
• apple
  • red
  • 苹果
• banana
  • yellow
  • 香蕉
• orange
  • orange
  • 橘子

or（This function is not perfect and is waiting for further development）

• 苹果
  • 颜色: 红色
  • 英文: apple
• 香蕉
  • 颜色: 黄色
  • 英文: banana
• 橘子
  • 颜色: 橙色
  • 英文: orange

注意要项

• 该模式下只能用二层列表
  • 多了无效1
    • 多了无效11
    • 多了无效12

List to timeline

List to timeline @todo So here you can optimize it, and it looks like it's going to be the same thing as 2ut @attension This may conflict with the table-extended plugin in render mode

1999.6	66666
2000.8	55555 + 44444 33333
2001.5	2222
2002.1	111111

list to label bar

demo: Now let's talk about how to install python

• Go to the official Python site and navigate to the latest version. As of this writing, it is' 3.10.6 '.
• Download the binaries for your platform. Execute binary.
• You don't need to select any options other than adding Python to 'PATH', because the default installer has everything you need. Simply click Install.

• You can install the program using the apt package in the terminal by executing the following command:

  apt-get install python3.6
      ```
  

• Go to the official Python site and navigate to the latest version. As of this writing, it is' 3.10.6 '.
• Download the binaries for your platform. Execute binary.
• On a Mac, this will be done by default in the dmg installer.

list to mermaid flow chart

（replenish：Its essence is to convert to graph TB grammar. So in addition to the normal operations, you can do a few other operations： For example, specifying aliases and joining outside the tree structure）

demo：Describe the brain diagram of tree design

add list root

If the list has root, we can write the list without root and add it to the header. This technique is great for flowcharts and mind maps

such as： [listroot(rootA)]

• B1
  • A
  • B
  • C
• B2
• B3

Turn to the mind map

（Since ob's version of mermaid is lower, it doesn't have mindmap, so here the plug-in has a new mermaid built in） （The downside, of course, is that the plugin size has changed from 200KB to more than 9MB. I will remove the built-in plugin once ob updates the mermaid version）

demo: I'll just use the official mermaid example here

Finish with two syntactic candies

• syntactic candies 1：When the selector is a list selector，and [] first char is 2，will append the list character to the front）
• syntactic candies 1.5：The first row of the list is preceded by：< ，Is regarded as the table top（Although there can be more than one row of headers, only the first header can be set here）
• syntactic candies 2：when [] the first char is !，[!XXX]will being[code]\n ad-xxx，That is to quickly generate the callout syntax）

AB three table classes

These three types of tables are mutually exclusive, and they parse the list differently That is: Table 1 looks good when it switches to Table A, but when you switch to Table B, it's generally not as intuitive

DataTable	数据表/标准表	Merging cells is not allowed
		Allows filter sort contrast function
BranchTable	分支表/分叉表	Allows parent cells to be merged vertically in a forked fashion
		Allows conversion to flow charts and brain diagrams Allows labeling of parent-child relationships (beta) Connections outside the tree structure are not allowed (flowcharts are OK)
TreeTable	树形表/树型表	Merging cells is not allowed
		Allows the hierarchy to be preserved in the first column Allow folding Allowable level coloring

Negative list selector（undeveloped）