How to display VDL-TABLE with entity values across scenarios, relative to the first selected scenario

Here's my current solution.

<vdl-row vdl-if="=scenarios.length == 2">

  <!-- Custom table for comparing two scenarios -->

  <div class="table-wrapper">

    <table class="insight-table table-main table-condensed">

      <thead>

        <tr>

          <th>KPI</th>

          <th vdl-text="=scenario.props.name" />

          <th vdl-text="=scenarios[1].props.name">

          <th>Delta (abs)</th>

          <th>Delta (rel)</th>

        </tr>

      </thead>

      <tbody>

        <tr vdl-repeat="=k in scenario.entities.KPIs">

          <td vdl-text="=k.label" class="index" />

          <td vdl-repeat="=s,i in scenarios"

            vdl-text="=insight.Formatter.formatNumber(s.entities.SummaryKPI(k.value).value, '#,##0')"

            class="numeric" />

          <td vdl-text="=insight.Formatter.formatNumber(scenarios[1].entities.SummaryKPI(k.value).value - scenario.entities.SummaryKPI(k.value).value, '#,##0')"

            class="numeric"/>

          <td vdl-text="=insight.Formatter.formatNumber((scenarios[1].entities.SummaryKPI(k.value).value - scenario.entities.SummaryKPI(k.value).value)/scenario.entities.SummaryKPI(k.value).value, '#,##0.00%')"

            class="numeric"/>

        </tr>

      </tbody>

    </table>

  </div>

</vdl-row>

which produces this table:

KPIs Scenario1Scenario 2Delta (abs)Delta (rel)

Revenue             10                        20                   10             100%

Cost                      5                           6                     1               20%

Hi Alex, if all you need is to display differences with the first column then a custom render function may be your best bet.

<script>

function differenceFn(data, type, rowData, pos) {

if (type === 'display') {

if (pos.col > 1) {

var baseVal = rowData[1];

var diff = data - baseVal;

var diffToken = diff < 0 ? '-' : '+';

var percent = (100.0 / baseVal) * diff;

return diffToken + diff + ' (' + Math.round(percent) + '%)';

}

return data;

}

return data;

}

</script>

<vdl-table vdl-repeat-contents="=s,i in scenarios">

<vdl-table-column entity="NAGENTS" scenario="=i" editable="true" render="=differenceFn"></vdl-table-column>

</vdl-table>

This will display the differences similar to how you requested in your first request and doesn't require you to create your own table from scratch.

You would probably want to round differently and also use the name of the scenario in the table column heading attribute.

HTH, Joc