Setting date and time patterns via the GlobalObject

Global object

by Flexmonster Pivot Table

HTML

<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<button onclick="setReport1()">Set Report 1</button>
<button onclick="setReport2()">Set Report 2</button>

<div id="pivot-container">The component will appear here</div>

CSS

@import url(https://cdn.flexmonster.com/assets/jsfiddle-styles.css);

JavaScript

let pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  global: {
    options: {
      datePattern: "'Date: 'MM/dd/yy"
    }
  }
});

function setReport1() {
  pivot.setReport({
    dataSource: {
      data: [{
          "Date": {
            "type": "date string"
          },
          "Visitors": {
            "type": "number"
          }
        },
        {
          "Date": "2021-06-12",
          "Visitors": 5476
        },
        {
          "Date": "2021-11-11",
          "Visitors": 34657
        },
      ]
    }
  });
}

function setReport2() {
  pivot.setReport({
    dataSource: {
      data: [{
          "Date": {
            "type": "date string"
          },
          "Vaccinated": {
            "type": "number"
          }
        },
        {
          "Date": "2021-03-22",
          "Vaccinated": 310000
        },
        {
          "Date": "2021-03-23",
          "Vaccinated": 125000
        },
      ]
    }
  });
}