Edit in JSFiddle

let pivot = new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  height: 355, 
  report: {
    dataSource: {
      filename: "data/data.csv"
    },
    slice: {
      columns: [{
        filter: {
          members: ["color.[green]", "color.[red]", "color.[white]", "color.[yellow]"]
        },
        uniqueName: "Color"
      }],
      expands: {
        rows: [{
          tuple: ["category.[accessories]"]
        }]
      },
      measures: [{
        aggregation: "sum",
        uniqueName: "Price"
      }],
      reportFilters: [{
        uniqueName: "Business Type"
      }],
      rows: [{
        filter: {
          members: ["category.[accessories]", "category.[clothing]"]
        },
        uniqueName: "Category"
      }, {
        filter: {
          members: ["country.[france]", "country.[germany]", "country.[united kingdom]"]
        },
        uniqueName: "Country"
      }, {
        uniqueName: "[Measures]"
      }]
    }
  }
});

function toggleFilters() {
  setGridOption('showFilter', !flexmonster.getOptions().grid.showFilter);
}

function toggleHeaders() {
  setGridOption('showHeaders', !flexmonster.getOptions().grid.showHeaders);
}


function toggleGrandTotals() {
  let showGrandTotals = flexmonster.getOptions().grid.showGrandTotals;
  setGridOption('showGrandTotals', showGrandTotals === 'on' ? 'off' : 'on');
}


function setGridOption(option, value) {
  flexmonster.setOptions({
    grid: {
      [option]: value
    }
  });
  flexmonster.refresh();
}

document.querySelectorAll('.selectopt').forEach(function(opt) {
  opt.addEventListener('change', function() {
    setGridOption('type', this.value);
  });
});
<script src="https://cdn.flexmonster.com/flexmonster.js"></script>

<div class="buttons-container">
  <div class="select-container">
    <span class="text">Grid type: </span>
    <div class="select" tabindex="1">
    <input class="selectopt" name="grid-type" type="radio" id="opt1" value="compact" checked>
      <label for="opt1" class="option">Compact view</label>
      <input class="selectopt" name="grid-type" type="radio" id="opt2" value="classic">
      <label for="opt2" class="option">Classic view</label>
      <input class="selectopt" name="grid-type" type="radio" id="opt3" value="flat">
      <label for="opt3" class="option">Flat view</label>
    </div>
  </div>
  <div class="second-row-buttons">
    <div class="switch-container">
      <label class="switch">
        <input type="checkbox" onclick="toggleFilters()" checked>
        <span class="slider round"></span>
      </label>
      <span class="text">Filters</span>
    </div>
    <div class="spacer"></div>
    <div class="switch-container">
      <label class="switch">
        <input type="checkbox" onclick="toggleHeaders()" checked>
        <span class="slider round"></span>
      </label>
      <span class="text">Headers</span>
    </div>
    <div class="spacer"></div>
    <div class="switch-container">
      <label class="switch">
        <input type="checkbox" onclick="toggleGrandTotals()" checked>
        <span class="slider round"></span>
      </label>
      <span class="text">Grand totals</span>
    </div>
  </div>
</div>

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