diff --git a/packages/datalib/src/PerspectiveDisplay.ts b/packages/datalib/src/PerspectiveDisplay.ts
index 330fb9c98..ca4cff0e3 100644
--- a/packages/datalib/src/PerspectiveDisplay.ts
+++ b/packages/datalib/src/PerspectiveDisplay.ts
@@ -1,7 +1,11 @@
 import { PerspectiveTableNode, PerspectiveTreeNode } from './PerspectiveTreeNode';
 
 export class PerspectiveDisplayColumn {
-  constructor(public label: string, public field: string) {}
+  subColumns: PerspectiveDisplayColumn[] = [];
+  title: string;
+  dataField: string;
+
+  constructor() {}
 }
 
 export class PerspectiveDisplay {
@@ -9,10 +13,25 @@ export class PerspectiveDisplay {
 
   constructor(public root: PerspectiveTreeNode, public rows: any[]) {
     const children = root.childNodes;
+    this.fillChildren(root.childNodes, this.columns);
+  }
+
+  fillChildren(children: PerspectiveTreeNode[], columns: PerspectiveDisplayColumn[]) {
     for (const child of children) {
       if (child.isChecked) {
-        this.columns.push(new PerspectiveDisplayColumn(child.title, child.codeName));
+        const childColumn = this.nodeToColumn(child);
+        columns.push(childColumn);
       }
     }
   }
+
+  nodeToColumn(node: PerspectiveTreeNode) {
+    const res = new PerspectiveDisplayColumn();
+    res.title = node.columnTitle;
+    res.dataField = node.dataField;
+    if (node.isExpandable) {
+      this.fillChildren(node.childNodes, res.subColumns);
+    }
+    return res;
+  }
 }
diff --git a/packages/datalib/src/PerspectiveTreeNode.ts b/packages/datalib/src/PerspectiveTreeNode.ts
index e9075b0a3..7fae9aa76 100644
--- a/packages/datalib/src/PerspectiveTreeNode.ts
+++ b/packages/datalib/src/PerspectiveTreeNode.ts
@@ -53,6 +53,9 @@ export abstract class PerspectiveTreeNode {
   get fieldName() {
     return this.codeName;
   }
+  get dataField() {
+    return this.codeName;
+  }
   abstract getNodeLoadProps(parentRows: any[]): PerspectiveDataLoadProps;
   get isRoot() {
     return this.parentNode == null;
@@ -75,6 +78,9 @@ export abstract class PerspectiveTreeNode {
   get isChecked() {
     return this.config.checkedColumns.includes(this.uniqueName);
   }
+  get columnTitle() {
+    return this.title;
+  }
 
   toggleExpanded(value?: boolean) {
     this.includeInColumnSet('expandedColumns', this.uniqueName, value == null ? !this.isExpanded : value);
@@ -233,6 +239,10 @@ export class PerspectiveTableReferenceNode extends PerspectiveTableNode {
       dataColumns: null,
     };
   }
+
+  get columnTitle() {
+    return this.table.pureName;
+  }
 }
 
 export function getTableChildPerspectiveNodes(
diff --git a/packages/web/src/perspectives/PerspectiveTable.svelte b/packages/web/src/perspectives/PerspectiveTable.svelte
index 1c4f5f69e..d1600fcfe 100644
--- a/packages/web/src/perspectives/PerspectiveTable.svelte
+++ b/packages/web/src/perspectives/PerspectiveTable.svelte
@@ -78,9 +78,15 @@
   {#if display}
     <table>
       <thead>
+        <!-- {#each display.columnLevels as columnLevel}
+        <tr>
+
+        </tr>
+        {/each} -->
+
         <tr>
           {#each display.columns as column}
-            <th>{column.label}</th>
+            <th>{column.title}</th>
           {/each}
         </tr>
       </thead>
@@ -88,7 +94,7 @@
         {#each display.rows as row}
           <tr>
             {#each display.columns as column}
-              <td>{row[column.field]}</td>
+              <td>{row[column.dataField]}</td>
             {/each}
           </tr>
         {/each}