JSFiddle - React, Tailwind, and code Playground

by Flexmonster Pivot Table

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/flexmonster/2.3/demo.css">
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<div id="pivot-container"></div>

JavaScript

let pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: true,
  report: {
    dataSource: {
      type: "json",
      data: [{
          "Anno Congelamento": "2016",
          "Vitalita": "0",
        },
        {
          "Anno Congelamento": "2016",
          "Vitalita": "96.04",
        },
        {
          "Anno Congelamento": "2016",
          "Vitalita": "98.66",
        }
      ],
      mapping: {
        Vitalita: {
          type: "number"
        }
      }
    },
    slice: {
      rows: [{
        uniqueName: "Anno Congelamento"
      }],
      columns: [{
        uniqueName: "[Measures]"
      }],
      measures: [
        //Default average measure
        {
          uniqueName: "Vitalita",
          aggregation: "average",
        },
        //Count non-zero "Vitalita" values
        {
          uniqueName: "Count Not Zero Vitalita",
          formula: "if( sum(\"Vitalita\") > 0 , 1 , 0 )",
          individual: true,
          caption: "Count Not Zero Vitalita",
          active: false
        },
        //Custom avarage
        {
          uniqueName: "Avg Not 0",
          formula: "sum(\"Vitalita\") / \"Count Not Zero Vitalita\"",
          caption: "Avarage without 0",
        }
      ]
    }
  }
});