1

I am having a problem with a table in DC.js. Every odd numbered row is extra. The table should just output two columns. The first column is state and the second is an amount called fund. But as you can see in the image there is an extra row which only displays a number, the same number which is in the right column of every even row.

enter image description here

The JS code,

<script>
    var text = '[';
    var obj;
    url = "/funding";
    d3.json(url, function(error, json_response) {
      for (var item in json_response['proposals']) {
        item = parseInt(item);
        fund = json_response['proposals'][item]['totalPrice'];
        state = json_response['proposals'][item]['state'];
        obj = '{ "state":' + '"' + state + '"' + ', "fund":' + fund + '}';
        text += obj + ',';
      }
      text = text.substring(0, text.length - 1);
      text += ']';
      data = JSON.parse(text);
      cf = crossfilter(data);

      stateDim = cf.dimension(function(d) {
        return d.state;
      });
      fundDim = stateDim.group().reduceSum(function(d) {
        return d.fund;
      });

      datatable = dc.dataTable("#tablechart");
      datatable
        .dimension(stateDim)
        .group(function(d) {
          return d.fund;
        })
        .columns([
          function(d) {
            return d.state;
          },
          function(d) {
            return d.fund;
          }
        ]);

      dc.renderAll();
    });
  </script>

The html,

  <div class="table-responsive">
                    <table id="tablechart" class="table table-bordered table-hover table-striped">
                      <thead>
                        <tr class="header">
                          <th>State</th>
                          <th>Funding($)</th>
                        </tr>
                      </thead>
                    </table>
                  </div>

I tried adding, (which I got from here)

.showGroups(false)

but I get in the console,

Uncaught TypeError: datatable.dimension(...).group(...).showGroups is not a function
(anonymous function) @ (index):388
(anonymous function) @ d3.min.js:1
t @ d3.min.js:1
i @ d3.min.js:1

Thanks,

davidism
  • 121,510
  • 29
  • 395
  • 339
Shane G
  • 3,129
  • 10
  • 43
  • 85
  • 1
    `showGroups` is a 2.0 feature, which is still in beta. Indeed it's annoying that this feature should be so deeply baked in. But the library grew out of a demo and a lot of things were never designed to be general. – Gordon Jul 16 '16 at 13:16

1 Answers1

1

In the css this works,

.dc-table-group {
  display:none
}

Of course the table's odd rows are showing the grouping.

Useful related posts:

Hide group rows of dc.dataTable

dc datatable without grouping the rows

Community
  • 1
  • 1
Shane G
  • 3,129
  • 10
  • 43
  • 85