[Resolved] Create a pedigree chart

[Author]

Posts

[EmmaN7109]

I’m setting up a site with stallions from a special breed. Each stallion gets it own costum post type with costum fields. Two of the Fields i Sire and Dam.

The I would like to create a pedigree chart as a table. Sire and Dam is fetshed from the current post, grandparents is fetshed from the value before.

And is it possible to add a color of a name appers more than once in a chart?

[Luo Yang]

Hello,

Please elaborate the question with more details:
What kind of "color of a name" do you want?
In Toolset side, you can try these:
1) Create a custom post type "stallion":
https://toolset.com/course-lesson/creating-a-custom-post-type/

2) Create a custom taxonomy "color" assigned with post type "stallion":
https://toolset.com/course-lesson/creating-a-custom-taxonomy/

3) When you create/edit "stallion" post, you can assign it with multiple terms of taxonomy "color"

4) In the chart table, you can display current "stallion" post information + "color" terms.

[EmmaN7109]

Sorry, my explanation wasn't good enough.

I would like to create a pedigree as picture on each horse post. As a costume field I make Sire and Dam.
In the content template I have a pedigree table as this;

<table style="width: 80%;" border="1" cellspacing="1" cellpadding="5">
<tbody>
<tr style="height: 46px;">
<td style="height: 118px;" rowspan="4">Sire</td>
<td style="height: 70px;" rowspan="2">Sires Sire</td>
<td style="height: 46px;">Sires Sires Sire</td>
</tr>
<tr style="height: 24px;">
<td style="height: 24px;">Sires Sires Dam</td>
</tr>
<tr style="height: 24px;">
<td style="height: 48px;" rowspan="2">Sires Dam</td>
<td style="height: 24px;">Sires Dams Sire</td>
</tr>
<tr style="height: 24px;">
<td style="height: 24px;">Sires Dams Sire</td>
</tr>
<tr style="height: 24px;">
<td style="height: 96px;" rowspan="4">Undan<br />[types field='undan'][/types]</td>
<td style="height: 48px;" rowspan="2">Dams Sire</td>
<td style="height: 24px;">Dams Sires Sire</td>
</tr>
<tr style="height: 24px;">
<td style="height: 24px;">Dams Sires Dam</td>
</tr>
<tr style="height: 24px;">
<td style="height: 48px;" rowspan="2">Dams Dam</td>
<td style="height: 24px;">Dams Dams Sire</td>
</tr>
<tr style="height: 24px;">
<td style="height: 24px;">Dams Dams Dam</td>
</tr>
</tbody>
</table>

The information about Sire and Dam is in the horses costume field, but the I want next column with example Sires Sire and Sires Dam and so on to get data from the previous, in this example the Sire. Like a loop until the table ends.

By color I mean if it is possible to ad a color on background or the name in the table if a horse shows up more than once in the pedigree.

[Luo Yang]

There isn't such kind of exact feature within Toolset plugins:
1) I don't think it is a good idea to setup different post type for each stallion, you will get lots of post types in your website.
2) Since one stallion can have lots of children, grandchildren, grand-grandchildren ..., so it is not a good idea to use HTML table columns to display them, you will get a unknow columns/width table.
3) As I understanding, in your case, it needs to setup many-to-many relationships between different "stallion".

As a workaround, you can consider these, see below sandbox website:
Login URL:
hidden link

1) Enable legacy editor:
hidden link
enable option "Show both the legacy and Blocks interface and let me choose which to use for each item I build"

2) Setup two post types:
hidden link
- stallion
- Intermediatory CPTs

3) Add a post field group into post type "stallion", with two custom fields:
hidden link
- select field "sire-and-dam"
- checkbox field "Top level"

4) Two post type relationships:
hidden link
- one-to-many relatinship between "stallion" and "Intermediatory CPTs": stallions parents
- one-to-many relatinship between "stallion" and "Intermediatory CPTs": stallions children

So each "stallion" post can connect with other "stallion" post with many-to-many relationship

5) Setup stallion posts:
hidden link
Create "Intermediatory CPTs" posts, connect with other "stallion" posts in both parents/children relationships, for example:
hidden link

6) Setup two post views:
a) Parent post view:
hidden link
- query "stallion" posts
- filter by : Top level is a number equal to 1
- in view's loop, display the "stallion" post information + the child post view's shortcode

b) Child post view:
hidden link
- query "stallion" posts
- filter by : the post type relationship "stallions parents"
- in view's loop, display the content template shortcode with "item" attribute:
[wpv-post-body view_template="child-stallion" item="@stallion-child.parent"]

so it can display the related children "stallions" post infomation:

<div class="stallion-div-[wpv-post-id]">
[wpv-post-link] - [types field="sire-and-dam"][/types]
[wpv-view name="child-stallions"]
</div>

In above HTML codes, the wrapper HTML div tag uses a specific CSS class name stallion-div-[wpv-post-id], so you can use it to setup custom JS codes and change the DIV background color

7) Create a page, display above "Parent post view" shortcode:
hidden link
It works fine.

For your reference.

More helps:
https://toolset.com/course-lesson/enabling-legacy-version-of-toolset-views/
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/item-attribute/