Customize cells (add hyperlinks)

Customize cells

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>

<button onclick="clearCustomizing()">Clear Customizing</button>
<button onclick="startCustomizing()">Start Customizing</button>
<div id="pivot-container"></div>

CSS

.link {
  text-decoration: underline !important;
  cursor: pointer;
  color: #726b04 !important;
}

JavaScript

var pivot = new Flexmonster({
	container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  width: "100%",
  height: 430,
  toolbar: true,
  customizeCell: customizeCellFunction,
  report: {
    "dataSource": {
      "data": getData()
    },
    "slice": {
      "rows": [{
        "uniqueName": "Country"
      }, {
        "uniqueName": "Color"
      }],
      "columns": [{
        "uniqueName": "Category"
      }, {
        "uniqueName": "[Measures]"
      }],
      "measures": [{
        "uniqueName": "Price"
      }, {
        "uniqueName": "Quantity"
      }]
    }
  }
});

function customizeCellFunction(cell, data) {
console.log(data)
  if (data.hierarchy && data.hierarchy.uniqueName == "Country" && data.member) {
    var el = document.createElement( 'div' );
    el.innerHTML = cell.text;
    var parts = cell.text.split(el.innerText);
    if (parts.length == 2) {
      cell.text = parts[0] + "<a href='https://en.wikipedia.org/wiki/" + data.member.caption + "' target='_blank' class='link' onclick='preventExpand(event)'>" + el.innerText + "</a>" + parts[1];
    } else {
      cell.text = "<a href='https://en.wikipedia.org/wiki/" + data.member.caption + "' target='_blank' class='link' onclick='preventExpand(event)'>" + el.innerText + "</a>";
    }
  } else if (data.isDrillThrough && data.type != "header" && data.hierarchy && data.hierarchy.uniqueName == "Country") {
  	cell.text = "<a href='https://en.wikipedia.org/wiki/" + data.label + "' target='_blank' class='link' onclick='preventExpand(event)'>" + data.label + "</a>";
  }  
  
}

function preventExpand(e) {
  e.stopImmediatePropagation();
}

function clearCustomizing() {
  pivot.customizeCell(null);
}

function startCustomizing() {
  pivot.customizeCell(customizeCellFunction);
}

function getData() {
  return [{
    "Category": "Accessories",
    "Size": "262 oz",
    "Color": "red",
    "Destination": "Australia",
    "Business Type": "Specialty Bike Shop",
    "Country":...