JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://underscorejs.org/underscore-min.js"></script>
<table id="table">
    <thead>
        <th>domain group</th>
        <th>vertical</th>
        <th>measure</th>
        <th>Segment 1</th>
        <th>Segment 2</th>
    </thead>
    <tbody>
        
    </tbody>
</table>

CSS

#table th, #table td{
    border:1px solid #999
}

JavaScript

var row = '\
<% for(var i=0;i<children.length;i++) { %>\
<tr>\
    <td><%= group %></td>\
    <td><%= section_value %></td>\
    <td><%= children[i].measure %></td>\
    <td><%= children[i].value %></td>\
    <td><%= children[i].value %></td>\
</tr>\
<% } %>\
    ';
var data={
  "set": [
    {
      "id": 1,
      "segment_desc": "Segment 1",
      "segment_summary": [
        {
          "section_type": "domain group",
          "section_value": "group 1",
          "children": [
            {
              "children": [
                {
                  "format": "float",
                  "measure": "users clicking",
                  "value": 340
                },
                {
                  "format": "float",
                  "measure": "% users opening",
                  "value": 10
                }
              ],
              "section_type": "vertical",
              "section_value": "all"
            },
            {
              "children": [
                {
                  "format": "float",
                  "measure": "users clicking",
                  "value": 340
                },
                {
                  "format": "float",
                  "measure": "% users opening",
                  "value": 10
                }
              ],
              "section_type": "vertical",
              "section_value": "cars"
            }
          ]
        }
      ]
    },
    {
      "id": 2,
      "segment_desc": "Segment 2",
      "segment_summary": [
        {
          "section_type": "domain group",
          "section_value": "group 2",
          "children": [
            {
              "children": [
                {
                  "format": "float",
                  "measure": "users clicking",
                  "value": 340
                },
                {
                  "format": "float",
                  "measure": "% users opening",
                  "value": 1.24
                }
              ],
 ...