Skip to Content

Issue with deprecated libraries

Hello All,

I am implementing a Custom pivot Table in my project.

How ever am successfully able to create pivot table.

Now my issue is when am trying to integrate same Pivot table in my project it is throwing some error(pivotUI undefined).

After seeking some help of sap consultant confirmed that am using one deprecated library(sap.viz) in my project thats the reason it is throwing the error.

Now i want to use that(sap.viz) library as well as pivot table in my project.

Could any body please suggest me a solution to solve my issue.

Regards,

Shekar

Add a comment
10|10000 characters needed characters exceeded

Assigned Tags

Related questions

2 Answers

  • author's profile photo Former Member
    Former Member
    Posted on Jul 29, 2016 at 06:43 AM

    Hi,

    As Since version 1.32.0. The chart controls in the sap.viz.ui5 package (which were always marked as experimental) have been deprecated since 1.32.0

    You can use 1.28.37.

    In index file while bootstrap, use -

    src="https://sapui5.hana.ondemand.com/1.28.37/resources/sap-ui-core.js"

    Thanks,

    Chandan

    Add a comment
    10|10000 characters needed characters exceeded

    • Chandan,

      I have a requirement to develop pivot table in my project.As in sap we dont have any direct control to display pivot table.Then i went for developing custom pivot table.

      I am creating a pivot table with help of pivot.js Library

      This pivot table am displaying in my view it is displaying properly if am not declaring sap.viz ,once if i am declaring sap.viz am getting pivotUI is not a fucntion.

      jQuery.sap.declare("sap.ui.valuefactsplitapp.nav.pivotextension");

      var text = "hello";

      (function() {

      debugger;

      var callWithJQuery,

      indexOf = [].indexOf || function(item) {

      for (var i = 0, l = this.length; i < l; i++)

      {

      debugger;

      if (i in this && this[i] === item)

      return i;

      }

      return -1;

      },

      slice = [].slice,

      bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },

      hasProp = {}.hasOwnProperty;

      callWithJQuery = function(pivotModule) {

      if (typeof exports === "object" && typeof module === "object") {

      return pivotModule(require("jquery"));

      } else if (typeof define === "function" && define.amd) {

      return define(["jquery"], pivotModule);

      } else {

      return pivotModule(jQuery);

      }

      };

      callWithJQuery(function($) {

      /*

      Utilities

      */

      var PivotData, addSeparators, aggregatorTemplates, aggregators, dayNamesEn, derivers, getSort, locales, mthNamesEn, naturalSort, numberFormat, pivotTableRenderer, renderers, sortAs, usFmt, usFmtInt, usFmtPct, zeroPad;

      addSeparators = function(nStr, thousandsSep, decimalSep) {

      var rgx, x, x1, x2;

      nStr += '';

      x = nStr.split('.');

      x1 = x[0];

      x2 = x.length > 1 ? decimalSep + x[1] : '';

      rgx = /(\d+)(\d{3})/;

      while (rgx.test(x1)) {

      x1 = x1.replace(rgx, '$1' + thousandsSep + '$2');

      }

      return x1 + x2;

      };

      numberFormat = function(opts) {

      var defaults;

      defaults = {

      digitsAfterDecimal: 2,

      scaler: 1,

      thousandsSep: ",",

      decimalSep: ".",

      prefix: "",

      suffix: "",

      showZero: false

      };

      opts = $.extend(defaults, opts);

      return function(x) {

      var result;

      if (isNaN(x) || !isFinite(x)) {

      return "";

      }

      if (x === 0 && !opts.showZero) {

      return "";

      }

      result = addSeparators((opts.scaler * x).toFixed(opts.digitsAfterDecimal), opts.thousandsSep, opts.decimalSep);

      return "" + opts.prefix + result + opts.suffix;

      };

      };

      usFmt = numberFormat();

      usFmtInt = numberFormat({

      digitsAfterDecimal: 0

      });

      usFmtPct = numberFormat({

      digitsAfterDecimal: 1,

      scaler: 100,

      suffix: "%"

      });

      aggregatorTemplates = {

      count: function(formatter) {

      if (formatter == null) {

      formatter = usFmtInt;

      }

      return function() {

      return function(data, rowKey, colKey) {

      return {

      count: 0,

      push: function() {

      return this.count++;

      },

      value: function() {

      return this.count;

      },

      format: formatter

      };

      };

      };

      },

      countUnique: function(formatter) {

      if (formatter == null) {

      formatter = usFmtInt;

      }

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      uniq: [],

      push: function(record) {

      var ref;

      if (ref = record[attr], indexOf.call(this.uniq, ref) < 0) {

      return this.uniq.push(record[attr]);

      }

      },

      value: function() {

      return this.uniq.length;

      },

      format: formatter,

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      listUnique: function(sep) {

      debugger;

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      uniq: [],

      push: function(record) {

      var ref;

      if (ref = record[attr], indexOf.call(this.uniq, ref) < 0) {

      return this.uniq.push(record[attr]);

      }

      },

      value: function() {

      return this.uniq.join(sep);

      },

      format: function(x) {

      return x;

      },

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      sum: function(formatter) {

      debugger;

      if (formatter == null) {

      formatter = usFmt;

      }

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      sum: 0,

      push: function(record) {

      if (!isNaN(parseFloat(record[attr]))) {

      return this.sum += parseFloat(record[attr]);

      }

      },

      value: function() {

      return this.sum;

      },

      format: formatter,

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      min: function(formatter) {

      if (formatter == null) {

      formatter = usFmt;

      }

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      val: null,

      push: function(record) {

      var ref, x;

      x = parseFloat(record[attr]);

      if (!isNaN(x)) {

      return this.val = Math.min(x, (ref = this.val) != null ? ref : x);

      }

      },

      value: function() {

      return this.val;

      },

      format: formatter,

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      max: function(formatter) {

      if (formatter == null) {

      formatter = usFmt;

      }

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      val: null,

      push: function(record) {

      var ref, x;

      x = parseFloat(record[attr]);

      if (!isNaN(x)) {

      return this.val = Math.max(x, (ref = this.val) != null ? ref : x);

      }

      },

      value: function() {

      return this.val;

      },

      format: formatter,

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      average: function(formatter) {

      if (formatter == null) {

      formatter = usFmt;

      }

      return function(arg) {

      var attr;

      attr = arg[0];

      return function(data, rowKey, colKey) {

      return {

      sum: 0,

      len: 0,

      push: function(record) {

      if (!isNaN(parseFloat(record[attr]))) {

      this.sum += parseFloat(record[attr]);

      return this.len++;

      }

      },

      value: function() {

      return this.sum / this.len;

      },

      format: formatter,

      numInputs: attr != null ? 0 : 1

      };

      };

      };

      },

      };

      aggregators = (function(tpl) {

      debugger;

      return {

      "Count": tpl.count(usFmtInt),

      "Count Unique Values": tpl.countUnique(usFmtInt),

      "List Unique Values": tpl.listUnique(", "),

      "Sum": tpl.sum(usFmt),

      "Integer Sum": tpl.sum(usFmtInt),

      "Average": tpl.average(usFmt),

      "Minimum": tpl.min(usFmt),

      };

      })(aggregatorTemplates);

      renderers = {

      "Table": function(data, opts) {

      return pivotTableRenderer(data, opts);

      },

      "Table Barchart": function(data, opts) {

      return $(pivotTableRenderer(data, opts)).barchart();

      },

      "Heatmap": function(data, opts) {

      return $(pivotTableRenderer(data, opts)).heatmap("heatmap", opts);

      },

      "Row Heatmap": function(data, opts) {

      return $(pivotTableRenderer(data, opts)).heatmap("rowheatmap", opts);

      },

      "Col Heatmap": function(data, opts) {

      return $(pivotTableRenderer(data, opts)).heatmap("colheatmap", opts);

      }

      };

      locales = {

      en: {

      aggregators: aggregators,

      renderers: renderers,

      localeStrings: {

      renderError: "An error occurred rendering the PivotTable results.",

      computeError: "An error occurred computing the PivotTable results.",

      uiRenderError: "An error occurred rendering the PivotTable UI.",

      selectAll: "Select All",

      selectNone: "DeSelect All",

      tooMany: "(too many to list)",

      filterResults: "Filter results",

      totals: "Totals",

      vs: "vs",

      by: "by"

      }

      }

      };

      mthNamesEn = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

      dayNamesEn = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];

      zeroPad = function(number) {

      return ("0" + number).substr(-2, 2);

      };

      derivers = {

      bin: function(col, binWidth) {

      return function(record) {

      return record[col] - record[col] % binWidth;

      };

      },

      dateFormat: function(col, formatString, utccontent, mthNames, dayNames) {

      var utc;

      if (utccontent == null) {

      utccontent = false;

      }

      if (mthNames == null) {

      mthNames = mthNamesEn;

      }

      if (dayNames == null) {

      dayNames = dayNamesEn;

      }

      utc = utccontent ? "UTC" : "";

      return function(record) {

      var date;

      date = new Date(Date.parse(record[col]));

      if (isNaN(date)) {

      return "";

      }

      return formatString.replace(/%(.)/g, function(m, p) {

      switch (p) {

      case "y":

      return date["get" + utc + "FullYear"]();

      case "m":

      return zeroPad(date["get" + utc + "Month"]() + 1);

      case "n":

      return mthNames[date["get" + utc + "Month"]()];

      case "d":

      return zeroPad(date["get" + utc + "Date"]());

      case "w":

      return dayNames[date["get" + utc + "Day"]()];

      case "x":

      return date["get" + utc + "Day"]();

      case "H":

      return zeroPad(date["get" + utc + "Hours"]());

      case "M":

      return zeroPad(date["get" + utc + "Minutes"]());

      case "S":

      return zeroPad(date["get" + utc + "Seconds"]());

      default:

      return "%" + p;

      }

      });

      };

      }

      };

      naturalSort = (function(_this) {

      return function(as, bs) {

      var a, a1, b, b1, rd, rx, rz;

      rx = /(\d+)|(\D+)/g;

      rd = /\d/;

      rz = /^0/;

      if (typeof as === "number" || typeof bs === "number") {

      if (isNaN(as)) {

      return 1;

      }

      if (isNaN(bs)) {

      return -1;

      }

      return as - bs;

      }

      a = String(as).toLowerCase();

      b = String(bs).toLowerCase();

      if (a === b) {

      return 0;

      }

      if (!(rd.test(a) && rd.test(b))) {

      return (a > b ? 1 : -1);

      }

      a = a.match(rx);

      b = b.match(rx);

      while (a.length && b.length) {

      a1 = a.shift();

      b1 = b.shift();

      if (a1 !== b1) {

      if (rd.test(a1) && rd.test(b1)) {

      return a1.replace(rz, ".0") - b1.replace(rz, ".0");

      } else {

      return (a1 > b1 ? 1 : -1);

      }

      }

      }

      return a.length - b.length;

      };

      })(this);

      sortAs = function(order) {

      var i, mapping, x;

      mapping = {};

      for (i in order) {

      x = order[i];

      mapping[x] = i;

      }

      return function(a, b) {

      if ((mapping[a] != null) && (mapping[b] != null)) {

      return mapping[a] - mapping[b];

      } else if (mapping[a] != null) {

      return -1;

      } else if (mapping[b] != null) {

      return 1;

      } else {

      return naturalSort(a, b);

      }

      };

      };

      getSort = function(sorters, attr) {

      var sort;

      sort = sorters(attr);

      if ($.isFunction(sort)) {

      return sort;

      } else {

      return naturalSort;

      debugger;

      }

      };

      /*

      Data Model class

      */

      PivotData = (function() {

      debugger;

      function PivotData(input, opts) {

      debugger;

      this.getAggregator = bind(this.getAggregator, this);

      this.getRowKeys = bind(this.getRowKeys, this);

      this.getColKeys = bind(this.getColKeys, this);

      this.sortKeys = bind(this.sortKeys, this);

      this.arrSort = bind(this.arrSort, this);

      this.aggregator = opts.aggregator;

      this.aggregatorName = opts.aggregatorName;

      this.colAttrs = opts.cols;

      this.rowAttrs = opts.rows;

      this.valAttrs = opts.vals;

      this.sorters = opts.sorters;

      this.tree = {};

      this.rowKeys = [];

      this.colKeys = [];

      this.rowTotals = {};

      this.colTotals = {};

      this.allTotal = this.aggregator(this, [], []);

      this.sorted = false;

      PivotData.forEachRecord(input, opts.derivedAttributes, (function(_this) {

      return function(record) {

      if (opts.filter(record)) {

      return _this.processRecord(record);

      }

      };

      })(this));

      }

      PivotData.forEachRecord = function(input, derivedAttributes, f) {

      var addRecord, compactRecord, i, j, k, l, len1, record, ref, results, results1, tblCols;

      if ($.isEmptyObject(derivedAttributes)) {

      addRecord = f;

      } else {

      addRecord = function(record) {

      var k, ref, v;

      for (k in derivedAttributes) {

      v = derivedAttributes[k];

      record[k] = (ref = v(record)) != null ? ref : record[k];

      }

      return f(record);

      };

      }

      if ($.isFunction(input)) {

      return input(addRecord);

      } else if ($.isArray(input)) {

      if ($.isArray(input[0])) {

      results = [];

      for (i in input) {

      if (!hasProp.call(input, i)) continue;

      compactRecord = input[i];

      if (!(i > 0)) {

      continue;

      }

      record = {};

      ref = input[0];

      for (j in ref) {

      if (!hasProp.call(ref, j)) continue;

      k = ref[j];

      record[k] = compactRecord[j];

      }

      results.push(addRecord(record));

      }

      return results;

      } else {

      results1 = [];

      for (l = 0, len1 = input.length; l < len1; l++) {

      record = input[l];

      results1.push(addRecord(record));

      }

      return results1;

      }

      } else if (input instanceof jQuery) {

      tblCols = [];

      $("thead > tr > th", input).each(function(i) {

      return tblCols.push($(this).text());

      });

      return $("tbody > tr", input).each(function(i) {

      record = {};

      $("td", this).each(function(j) {

      return record[tblCols[j]] = $(this).text();

      });

      return addRecord(record);

      });

      } else {

      throw new Error("unknown input format");

      }

      };

      PivotData.convertToArray = function(input) {

      var result;

      result = [];

      PivotData.forEachRecord(input, {}, function(record) {

      return result.push(record);

      });

      return result;

      };

      PivotData.prototype.arrSort = function(attrs) {

      debugger;

      var a, sortersArr;

      sortersArr = (function() {

      var l, len1, results;

      results = [];

      for (l = 0, len1 = attrs.length; l < len1; l++) {

      a = attrs[l];

      results.push(getSort(this.sorters, a));

      }

      return results;

      }).call(this);

      return function(a, b) {

      var comparison, i, sorter;

      for (i in sortersArr) {

      if (!hasProp.call(sortersArr, i)) continue;

      sorter = sortersArr[i];

      comparison = sorter(a[i], b[i]);

      if (comparison !== 0) {

      return comparison;

      }

      }

      return 0;

      };

      };

      PivotData.prototype.sortKeys = function() {

      if (!this.sorted) {

      this.sorted = true;

      this.rowKeys.sort(this.arrSort(this.rowAttrs));

      return this.colKeys.sort(this.arrSort(this.colAttrs));

      }

      };

      PivotData.prototype.getColKeys = function() {

      this.sortKeys();

      return this.colKeys;

      };

      PivotData.prototype.getRowKeys = function() {

      this.sortKeys();

      return this.rowKeys;

      };

      PivotData.prototype.processRecord = function(record) {

      var colKey, flatColKey, flatRowKey, l, len1, len2, n, ref, ref1, ref2, ref3, rowKey, x;

      colKey = [];

      rowKey = [];

      ref = this.colAttrs;

      for (l = 0, len1 = ref.length; l < len1; l++) {

      x = ref[l];

      colKey.push((ref1 = record[x]) != null ? ref1 : "null");

      }

      ref2 = this.rowAttrs;

      for (n = 0, len2 = ref2.length; n < len2; n++) {

      x = ref2[n];

      rowKey.push((ref3 = record[x]) != null ? ref3 : "null");

      }

      flatRowKey = rowKey.join(String.fromCharCode(0));

      flatColKey = colKey.join(String.fromCharCode(0));

      this.allTotal.push(record);

      if (rowKey.length !== 0) {

      if (!this.rowTotals[flatRowKey]) {

      this.rowKeys.push(rowKey);

      this.rowTotals[flatRowKey] = this.aggregator(this, rowKey, []);

      }

      this.rowTotals[flatRowKey].push(record);

      }

      if (colKey.length !== 0) {

      if (!this.colTotals[flatColKey]) {

      this.colKeys.push(colKey);

      this.colTotals[flatColKey] = this.aggregator(this, [], colKey);

      }

      this.colTotals[flatColKey].push(record);

      }

      if (colKey.length !== 0 && rowKey.length !== 0) {

      if (!this.tree[flatRowKey]) {

      this.tree[flatRowKey] = {};

      }

      if (!this.tree[flatRowKey][flatColKey]) {

      this.tree[flatRowKey][flatColKey] = this.aggregator(this, rowKey, colKey);

      }

      return this.tree[flatRowKey][flatColKey].push(record);

      }

      };

      PivotData.prototype.getAggregator = function(rowKey, colKey) {

      var agg, flatColKey, flatRowKey;

      flatRowKey = rowKey.join(String.fromCharCode(0));

      flatColKey = colKey.join(String.fromCharCode(0));

      if (rowKey.length === 0 && colKey.length === 0) {

      agg = this.allTotal;

      } else if (rowKey.length === 0) {

      agg = this.colTotals[flatColKey];

      } else if (colKey.length === 0) {

      agg = this.rowTotals[flatRowKey];

      } else {

      agg = this.tree[flatRowKey][flatColKey];

      }

      return agg != null ? agg : {

      value: (function() {

      return null;

      }),

      format: function() {

      return "";

      }

      };

      };

      return PivotData;

      })();

      $.pivotUtilities = {

      aggregatorTemplates: aggregatorTemplates,

      aggregators: aggregators,

      renderers: renderers,

      derivers: derivers,

      locales: locales,

      naturalSort: naturalSort,

      numberFormat: numberFormat,

      sortAs: sortAs,

      PivotData: PivotData

      };

      /*

      Default Renderer for hierarchical table layout

      */

      pivotTableRenderer = function(pivotData, opts) {

      var aggregator, c, colAttrs, colKey, colKeys, defaults, i, j, r, result, rowAttrs, rowKey, rowKeys, spanSize, tbody, td, th, thead, totalAggregator, tr, txt, val, x;

      defaults = {

      localeStrings: {

      totals: "Totals"

      }

      };

      opts = $.extend(defaults, opts);

      colAttrs = pivotData.colAttrs;

      rowAttrs = pivotData.rowAttrs;

      rowKeys = pivotData.getRowKeys();

      colKeys = pivotData.getColKeys();

      result = document.createElement("table");

      result.className = "pvtTable";

      spanSize = function(arr, i, j) {

      debugger;

      var l, len, n, noDraw, ref, ref1, stop, x;

      if (i !== 0) {

      noDraw = true;

      for (x = l = 0, ref = j; 0 <= ref ? l <= ref : l >= ref; x = 0 <= ref ? ++l : --l) {

      if (arr[i - 1][x] !== arr[i][x]) {

      noDraw = false;

      }

      }

      if (noDraw) {

      return -1;

      }

      }

      len = 0;

      while (i + len < arr.length) {

      debugger;

      stop = false;

      for (x = n = 0, ref1 = j; 0 <= ref1 ? n <= ref1 : n >= ref1; x = 0 <= ref1 ? ++n : --n) {

      if (arr[i][x] !== arr[i + len][x]) {

      stop = true;

      }

      }

      if (stop) {

      break;

      }

      len++;

      }

      return len;

      debugger;

      };

      thead = document.createElement("thead");

      for (j in colAttrs) {

      if (!hasProp.call(colAttrs, j)) continue;

      c = colAttrs[j];

      tr = document.createElement("tr");

      if (parseInt(j) === 0 && rowAttrs.length !== 0) {

      th = document.createElement("th");

      th.setAttribute("colspan", rowAttrs.length);

      th.setAttribute("rowspan", colAttrs.length);

      tr.appendChild(th);

      }

      th = document.createElement("th");

      th.className = "pvtAxisLabel";

      th.textContent = c;

      tr.appendChild(th);

      for (i in colKeys) {

      if (!hasProp.call(colKeys, i)) continue;

      colKey = colKeys[i];

      x = spanSize(colKeys, parseInt(i), parseInt(j));

      if (x !== -1) {

      th = document.createElement("th");

      th.className = "pvtColLabel";

      th.textContent = colKey[j];

      th.setAttribute("colspan", x);

      if (parseInt(j) === colAttrs.length - 1 && rowAttrs.length !== 0) {

      th.setAttribute("rowspan", 2);

      }

      tr.appendChild(th);

      }

      }

      if (parseInt(j) === 0) {

      th = document.createElement("th");

      th.className = "pvtTotalLabel";

      th.innerHTML = opts.localeStrings.totals;

      th.setAttribute("rowspan", colAttrs.length + (rowAttrs.length === 0 ? 0 : 1));

      tr.appendChild(th);

      }

      thead.appendChild(tr);

      }

      if (rowAttrs.length !== 0) {

      tr = document.createElement("tr");

      for (i in rowAttrs) {

      if (!hasProp.call(rowAttrs, i)) continue;

      r = rowAttrs[i];

      th = document.createElement("th");

      th.className = "pvtAxisLabel";

      th.textContent = r;

      tr.appendChild(th);

      }

      th = document.createElement("th");

      if (colAttrs.length === 0) {

      th.className = "pvtTotalLabel";

      th.innerHTML = opts.localeStrings.totals;

      }

      tr.appendChild(th);

      thead.appendChild(tr);

      }

      debugger;

      result.appendChild(thead);

      tbody = document.createElement("tbody");

      for (i in rowKeys) {

      if (!hasProp.call(rowKeys, i)) continue;

      rowKey = rowKeys[i];

      tr = document.createElement("tr");

      for (j in rowKey) {

      if (!hasProp.call(rowKey, j)) continue;

      txt = rowKey[j];

      x = spanSize(rowKeys, parseInt(i), parseInt(j));

      if (x !== -1) {

      th = document.createElement("th");

      th.className = "pvtRowLabel";

      th.textContent = txt;

      th.setAttribute("rowspan", x);

      if (parseInt(j) === rowAttrs.length - 1 && colAttrs.length !== 0) {

      th.setAttribute("colspan", 2);

      }

      tr.appendChild(th);

      }

      }

      for (j in colKeys) {

      if (!hasProp.call(colKeys, j)) continue;

      colKey = colKeys[j];

      aggregator = pivotData.getAggregator(rowKey, colKey);

      val = aggregator.value();

      td = document.createElement("td");

      td.className = "pvtVal row" + i + " col" + j;

      td.textContent = aggregator.format(val);

      td.setAttribute("data-value", val);

      tr.appendChild(td);

      }

      totalAggregator = pivotData.getAggregator(rowKey, []);

      val = totalAggregator.value();

      td = document.createElement("td");

      td.className = "pvtTotal rowTotal";

      td.textContent = totalAggregator.format(val);

      td.setAttribute("data-value", val);

      td.setAttribute("data-for", "row" + i);

      tr.appendChild(td);

      tbody.appendChild(tr);

      }

      tr = document.createElement("tr");

      th = document.createElement("th");

      th.className = "pvtTotalLabel";

      th.innerHTML = opts.localeStrings.totals;

      th.setAttribute("colspan", rowAttrs.length + (colAttrs.length === 0 ? 0 : 1));

      tr.appendChild(th);

      for (j in colKeys) {

      if (!hasProp.call(colKeys, j)) continue;

      colKey = colKeys[j];

      totalAggregator = pivotData.getAggregator([], colKey);

      val = totalAggregator.value();

      td = document.createElement("td");

      td.className = "pvtTotal colTotal";

      td.textContent = totalAggregator.format(val);

      td.setAttribute("data-value", val);

      td.setAttribute("data-for", "col" + j);

      tr.appendChild(td);

      }

      totalAggregator = pivotData.getAggregator([], []);

      debugger;

      val = totalAggregator.value();

      td = document.createElement("td");

      td.className = "pvtGrandTotal";

      td.textContent = totalAggregator.format(val);

      td.setAttribute("data-value", val);

      tr.appendChild(td);

      tbody.appendChild(tr);

      result.appendChild(tbody);

      result.setAttribute("data-numrows", rowKeys.length);

      result.setAttribute("data-numcols", colKeys.length);

      return result;

      };

      /*

      Pivot Table core: create PivotData object and call Renderer on it

      */

      $.fn.pivot = function(input, opts) {

      var defaults, e, error, error1, pivotData, result, x;

      defaults = {

      cols: [],

      rows: [],

      vals: [],

      dataClass: PivotData,

      filter: function() {

      return true;

      },

      aggregator: aggregatorTemplates.count()(),

      aggregatorName: "Count",

      sorters: function() {},

      derivedAttributes: {},

      renderer: pivotTableRenderer,

      rendererOptions: null,

      localeStrings: locales.en.localeStrings

      };

      opts = $.extend(defaults, opts);

      result = null;

      try {

      pivotData = new opts.dataClass(input, opts);

      try {

      result = opts.renderer(pivotData, opts.rendererOptions);

      } catch (error) {

      e = error;

      if (typeof console !== "undefined" && console !== null) {

      console.error(e.stack);

      }

      result = $("<span>").html(opts.localeStrings.renderError);

      }

      } catch (error1) {

      e = error1;

      if (typeof console !== "undefined" && console !== null) {

      console.error(e.stack);

      }

      result = $("<span>").html(opts.localeStrings.computeError);

      }

      x = this[0];

      while (x.hasChildNodes()) {

      x.removeChild(x.lastChild);

      }

      return this.append(result);

      };

      /*

      Pivot Table UI: calls Pivot Table core above with options set by user

      */

      $.fn.pivotUI = function(input, inputOpts, overwrite, locale) {

      var a, aggregator, attrLength, axisValues, c, colList, defaults, e, error, existingOpts, fn, i, initialRender, k, l, len1, len2, len3, len4, n, o, opts, pivotTable, q, ref, ref1, ref2, ref3, ref4, refresh, refreshDelayed, renderer, rendererControl, shownAttributes, tblCols, tr1, tr2, uiTable, unusedAttrsVerticalAutoCutoff, unusedAttrsVerticalAutoOverride, x;

      if (overwrite == null) {

      overwrite = false;

      }

      if (locale == null) {

      locale = "en";

      }

      if (locales[locale] == null) {

      locale = "en";

      }

      defaults = {

      derivedAttributes: {},

      aggregators: locales[locale].aggregators,

      renderers: locales[locale].renderers,

      hiddenAttributes: [],

      menuLimit: 200,

      cols: [],

      rows: [],

      vals: [],

      dataClass: PivotData,

      exclusions: {},

      inclusions: {},

      unusedAttrsVertical: 85,

      autoSortUnusedAttrs: false,

      rendererOptions: {

      localeStrings: locales[locale].localeStrings

      },

      onRefresh: null,

      filter: function() {

      return true;

      },

      sorters: function() {},

      localeStrings: locales[locale].localeStrings

      };

      existingOpts = this.data("pivotUIOptions");

      if ((existingOpts == null) || overwrite) {

      opts = $.extend(defaults, inputOpts);

      } else {

      opts = existingOpts;

      }

      try {

      input = PivotData.convertToArray(input);

      tblCols = (function() {

      var ref, results;

      ref = input[0];

      results = [];

      for (k in ref) {

      if (!hasProp.call(ref, k)) continue;

      results.push(k);

      }

      return results;

      })();

      ref = opts.derivedAttributes;

      for (c in ref) {

      if (!hasProp.call(ref, c)) continue;

      if ((indexOf.call(tblCols, c) < 0)) {

      tblCols.push(c);

      }

      }

      axisValues = {};

      for (l = 0, len1 = tblCols.length; l < len1; l++) {

      x = tblCols[l];

      axisValues[x] = {};

      }

      PivotData.forEachRecord(input, opts.derivedAttributes, function(record) {

      var base, results, v;

      results = [];

      for (k in record) {

      if (!hasProp.call(record, k)) continue;

      v = record[k];

      if (!(opts.filter(record))) {

      continue;

      }

      if (v == null) {

      v = "null";

      }

      if ((base = axisValues[k])[v] == null) {

      base[v] = 0;

      }

      results.push(axisValues[k][v]++);

      }

      return results;

      });

      uiTable = $("<table>", {

      "class": "pvtUi"

      }).attr("cellpadding", 5);

      rendererControl = $("<td>");

      renderer = $("<select>").addClass('pvtRenderer').appendTo(rendererControl).bind("change", function() {

      return refresh();

      });

      ref1 = opts.renderers;

      for (x in ref1) {

      if (!hasProp.call(ref1, x)) continue;

      $("<option>").val(x).html(x).appendTo(renderer);

      }

      colList = $("<td>").addClass('pvtAxisContainer pvtUnused');

      // colList = $("<td>").addClass('pvtAxisContainer')

      shownAttributes = (function() {

      var len2, n, results;

      results = [];

      for (n = 0, len2 = tblCols.length; n < len2; n++) {

      c = tblCols[n];

      if (indexOf.call(opts.hiddenAttributes, c) < 0) {

      results.push(c);

      }

      }

      return results;

      })();

      unusedAttrsVerticalAutoOverride = false;

      if (opts.unusedAttrsVertical === "auto") {

      unusedAttrsVerticalAutoCutoff = 120;

      } else {

      unusedAttrsVerticalAutoCutoff = parseInt(opts.unusedAttrsVertical);

      }

      if (!isNaN(unusedAttrsVerticalAutoCutoff)) {

      attrLength = 0;

      for (n = 0, len2 = shownAttributes.length; n < len2; n++) {

      a = shownAttributes[n];

      attrLength += a.length;

      }

      unusedAttrsVerticalAutoOverride = attrLength > unusedAttrsVerticalAutoCutoff;

      }

      if (opts.unusedAttrsVertical === true || unusedAttrsVerticalAutoOverride) {

      colList.addClass('pvtVertList');

      } else {

      colList.addClass('pvtHorizList');

      }

      fn = function(c) {

      var attrElem, btns, checkContainer, filterItem, filterItemExcluded, hasExcludedItem, keys, len3, o, ref2, showFilterList, triangleLink, updateFilter, v, valueList;

      keys = (function() {

      var results;

      results = [];

      for (k in axisValues[c]) {

      results.push(k);

      }

      return results;

      })();

      hasExcludedItem = false;

      valueList = $("<div>").addClass('pvtFilterBox').hide();

      valueList.append($("<h4>").text(c + " (" + keys.length + ")"));

      if (keys.length > opts.menuLimit) {

      valueList.append($("<p>").html(opts.localeStrings.tooMany));

      } else {

      btns = $("<p>").appendTo(valueList);

      btns.append($("<button id = 'selectAll'>", {

      type: "button"

      }).html(opts.localeStrings.selectAll).bind("click", function() {

      return valueList.find("input:visible").prop("checked", true);

      }));

      btns.append($("<button id = 'selectNone'>", {

      type: "button"

      }).html(opts.localeStrings.selectNone).bind("click", function() {

      return valueList.find("input:visible").prop("checked", false);

      }));

      btns.append($("<br>"));

      btns.append($("<input>", {

      type: "text",

      placeholder: opts.localeStrings.filterResults,

      "class": "pvtSearch"

      }).bind("keyup", function() {

      var filter;

      filter = $(this).val().toLowerCase();

      return valueList.find('.pvtCheckContainer p').each(function() {

      var testString;

      testString = $(this).text().toLowerCase().indexOf(filter);

      if (testString !== -1) {

      return $(this).show();

      } else {

      return $(this).hide();

      }

      });

      }));

      checkContainer = $("<div>").addClass("pvtCheckContainer").appendTo(valueList);

      ref2 = keys.sort(getSort(opts.sorters, c));

      for (o = 0, len3 = ref2.length; o < len3; o++) {

      k = ref2[o];

      v = axisValues[c][k];

      filterItem = $("<label>");

      filterItemExcluded = false;

      if (opts.inclusions[c]) {

      filterItemExcluded = (indexOf.call(opts.inclusions[c], k) < 0);

      } else if (opts.exclusions[c]) {

      filterItemExcluded = (indexOf.call(opts.exclusions[c], k) >= 0);

      }

      hasExcludedItem || (hasExcludedItem = filterItemExcluded);

      $("<input>").attr("type", "checkbox").addClass('pvtFilter').attr("checked", !filterItemExcluded).data("filter", [c, k]).appendTo(filterItem);

      filterItem.append($("<span>").text(k));

      filterItem.append($("<span>").text(" (" + v + ")"));

      checkContainer.append($("<p>").append(filterItem));

      }

      }

      updateFilter = function() {

      debugger;

      var unselectedCount;

      debugger;

      unselectedCount = valueList.find("[type='checkbox']").length - valueList.find("[type='checkbox']:checked").length;

      if (unselectedCount > 0) {

      attrElem.addClass("pvtFilteredAttribute");

      } else {

      attrElem.removeClass("pvtFilteredAttribute");

      }

      if (keys.length > opts.menuLimit) {

      return valueList.toggle();

      } else {

      return valueList.toggle(0, refresh);

      }

      };

      $("<p>").appendTo(valueList).append($("<button>", {

      type: "button"

      }).text("OK").bind("click", updateFilter));

      showFilterList = function(e) {

      var clickLeft, clickTop, ref3;

      ref3 = $(e.currentTarget).position(), clickLeft = ref3.left, clickTop = ref3.top;

      valueList.css({

      left: clickLeft + 10,

      top: clickTop + 10

      }).toggle();

      valueList.find('.pvtSearch').val('');

      return valueList.find('.pvtCheckContainer p').show();

      };

      triangleLink = $("<span>").addClass('pvtTriangle').html(" &#x25BE;").bind("click", showFilterList);

      attrElem = $("<li>").addClass("axis_" + i).append($("<span>").addClass('pvtAttr').text(c).data("attrName", c).append(triangleLink));

      if (hasExcludedItem) {

      attrElem.addClass('pvtFilteredAttribute');

      }

      colList.append(attrElem).append(valueList);

      return attrElem.bind("dblclick", showFilterList);

      };

      for (i in shownAttributes) {

      if (!hasProp.call(shownAttributes, i)) continue;

      c = shownAttributes[i];

      fn(c);

      }

      tr1 = $("<tr>").appendTo(uiTable);

      aggregator = $("<select>").addClass('pvtAggregator').bind("change", function() {

      return refresh();

      });

      ref2 = opts.aggregators;

      for (x in ref2) {

      if (!hasProp.call(ref2, x)) continue;

      aggregator.append($("<option>").val(x).html(x));

      }

      $("<td>").addClass('pvtVals').appendTo(tr1).append(aggregator);

      $("<td>").addClass('rowId').appendTo(tr1).text("Rows");

      $("<td>").addClass('pvtAxisContainer pvtHorizList pvtCols').appendTo(tr1);

      tr2 = $("<tr>").appendTo(uiTable);

      debugger;

      showHideDimensions = function(){

      $(".pvtAxisContainer.pvtUnused.pvtVertList.ui-sortable").slideToggle();

      //$(".pvtAxisContainer.pvtRows.ui-sortable").slideToggle();

      }

      $("<td>").addClass('pvtDimensions').appendTo(tr2).append($("<button>", {

      type: "button"

      }).text("Dimensions").bind("click", showHideDimensions));

      //$("<td>").addClass('').appendTo(tr2).text("");

      $("<td>").addClass('columnId').appendTo(tr2).text("Columns");

      tr2.append($("<td>").addClass('pvtAxisContainer pvtHorizList pvtRows').attr("valign", "top"));

      tr3 = $("<tr>").appendTo(uiTable);

      pivotTable = $("<td>").attr("valign", "top").addClass('pvtRendererArea').appendTo(tr3);

      if (opts.unusedAttrsVertical === true || unusedAttrsVerticalAutoOverride) {

      uiTable.find('tr:nth-child(1)').prepend(rendererControl);

      uiTable.find('tr:nth-child(3)').prepend(colList);

      } else {

      uiTable.prepend($("<tr>").append(rendererControl).append(colList));

      }

      this.html(uiTable);

      ref3 = opts.cols;

      for (o = 0, len3 = ref3.length; o < len3; o++) {

      x = ref3[o];

      this.find(".pvtCols").append(this.find(".axis_" + ($.inArray(x, shownAttributes))));

      }

      ref4 = opts.rows;

      for (q = 0, len4 = ref4.length; q < len4; q++) {

      x = ref4[q];

      this.find(".pvtRows").append(this.find(".axis_" + ($.inArray(x, shownAttributes))));

      }

      if (opts.aggregatorName != null) {

      this.find(".pvtAggregator").val(opts.aggregatorName);

      }

      if (opts.rendererName != null) {

      this.find(".pvtRenderer").val(opts.rendererName);

      }

      initialRender = true;

      refreshDelayed = (function(_this) {

      return function() {

      var attr, exclusions, inclusions, len5, newDropdown, numInputsToProcess, pivotUIOptions, pvtVals, ref5, ref6, s, subopts, t, unusedAttrsContainer, vals;

      subopts = {

      derivedAttributes: opts.derivedAttributes,

      localeStrings: opts.localeStrings,

      rendererOptions: opts.rendererOptions,

      sorters: opts.sorters,

      cols: [],

      rows: [],

      dataClass: opts.dataClass

      };

      numInputsToProcess = (ref5 = opts.aggregators[aggregator.val()]([])().numInputs) != null ? ref5 : 0;

      vals = [];

      _this.find(".pvtRows li span.pvtAttr").each(function() {

      return subopts.rows.push($(this).data("attrName"));

      });

      _this.find(".pvtCols li span.pvtAttr").each(function() {

      return subopts.cols.push($(this).data("attrName"));

      });

      _this.find(".pvtVals select.pvtAttrDropdown").each(function() {

      if (numInputsToProcess === 0) {

      return $(this).remove();

      } else {

      numInputsToProcess--;

      if ($(this).val() !== "") {

      return vals.push($(this).val());

      }

      }

      });

      if (numInputsToProcess !== 0) {

      debugger;

      pvtVals = _this.find(".pvtVals");

      for (x = s = 0, ref6 = numInputsToProcess; 0 <= ref6 ? s < ref6 : s > ref6; x = 0 <= ref6 ? ++s : --s) {

      newDropdown = $("<select>").addClass('pvtAttrDropdown').append($("<option>")).bind("change", function() {

      return refresh();

      });

      for (t = 0, len5 = shownAttributes.length; t < len5; t++) {

      attr = shownAttributes[t];

      newDropdown.append($("<option>").val(attr).text(attr));

      }

      pvtVals.append(newDropdown);

      }

      }

      if (initialRender) {

      vals = opts.vals;

      i = 0;

      _this.find(".pvtVals select.pvtAttrDropdown").each(function() {

      $(this).val(vals[i]);

      return i++;

      });

      initialRender = false;

      }

      subopts.aggregatorName = aggregator.val();

      subopts.vals = vals;

      subopts.aggregator = opts.aggregators[aggregator.val()](vals);

      subopts.renderer = opts.renderers[renderer.val()];

      exclusions = {};

      _this.find('input.pvtFilter').not(':checked').each(function() {

      var filter;

      filter = $(this).data("filter");

      if (exclusions[filter[0]] != null) {

      return exclusions[filter[0]].push(filter[1]);

      } else {

      return exclusions[filter[0]] = [filter[1]];

      }

      });

      inclusions = {};

      _this.find('input.pvtFilter:checked').each(function() {

      var filter;

      filter = $(this).data("filter");

      if (exclusions[filter[0]] != null) {

      if (inclusions[filter[0]] != null) {

      return inclusions[filter[0]].push(filter[1]);

      } else {

      return inclusions[filter[0]] = [filter[1]];

      }

      }

      });

      subopts.filter = function(record) {

      var excludedItems, ref7;

      if (!opts.filter(record)) {

      return false;

      }

      for (k in exclusions) {

      excludedItems = exclusions[k];

      if (ref7 = "" + record[k], indexOf.call(excludedItems, ref7) >= 0) {

      return false;

      }

      }

      return true;

      };

      pivotTable.pivot(input, subopts);

      pivotUIOptions = $.extend(opts, {

      cols: subopts.cols,

      rows: subopts.rows,

      vals: vals,

      exclusions: exclusions,

      inclusions: inclusions,

      inclusionsInfo: inclusions,

      aggregatorName: aggregator.val(),

      rendererName: renderer.val()

      });

      _this.data("pivotUIOptions", pivotUIOptions);

      if (opts.autoSortUnusedAttrs) {

      unusedAttrsContainer = _this.find("td.pvtUnused.pvtAxisContainer");

      $(unusedAttrsContainer).children("li").sort(function(a, b) {

      return naturalSort($(a).text(), $(b).text());

      }).appendTo(unusedAttrsContainer);

      }

      pivotTable.css("opacity", 1);

      if (opts.onRefresh != null) {

      return opts.onRefresh(pivotUIOptions);

      }

      };

      })(this);

      refresh = (function(_this) {

      return function() {

      pivotTable.css("opacity", 0.5);

      return setTimeout(refreshDelayed, 10);

      };

      })(this);

      refresh();

      this.find(".pvtAxisContainer").sortable({

      update: function(e, ui) {

      if (ui.sender == null) {

      return refresh();

      }

      },

      connectWith: this.find(".pvtAxisContainer"),

      items: 'li',

      placeholder: 'pvtPlaceholder'

      });

      } catch (error) {

      e = error;

      if (typeof console !== "undefined" && console !== null) {

      console.error(e.stack);

      }

      this.html(opts.localeStrings.uiRenderError);

      }

      return this;

      };

      /*

      Heatmap post-processing

      */

      $.fn.heatmap = function(scope, opts) {

      var colorScaleGenerator, heatmapper, i, j, l, n, numCols, numRows, ref, ref1, ref2;

      if (scope == null) {

      scope = "heatmap";

      }

      numRows = this.data("numrows");

      numCols = this.data("numcols");

      colorScaleGenerator = opts != null ? (ref = opts.heatmap) != null ? ref.colorScaleGenerator : void 0 : void 0;

      if (colorScaleGenerator == null) {

      colorScaleGenerator = function(values) {

      var max, min;

      min = Math.min.apply(Math, values);

      max = Math.max.apply(Math, values);

      return function(x) {

      var nonRed;

      nonRed = 255 - Math.round(255 * (x - min) / (max - min));

      return "rgb(255," + nonRed + "," + nonRed + ")";

      };

      };

      }

      heatmapper = (function(_this) {

      return function(scope) {

      var colorScale, forEachCell, values;

      forEachCell = function(f) {

      return _this.find(scope).each(function() {

      var x;

      x = $(this).data("value");

      if ((x != null) && isFinite(x)) {

      return f(x, $(this));

      }

      });

      };

      values = [];

      forEachCell(function(x) {

      return values.push(x);

      });

      colorScale = colorScaleGenerator(values);

      return forEachCell(function(x, elem) {

      return elem.css("background-color", colorScale(x));

      });

      };

      })(this);

      switch (scope) {

      case "heatmap":

      heatmapper(".pvtVal");

      break;

      case "rowheatmap":

      for (i = l = 0, ref1 = numRows; 0 <= ref1 ? l < ref1 : l > ref1; i = 0 <= ref1 ? ++l : --l) {

      heatmapper(".pvtVal.row" + i);

      }

      break;

      case "colheatmap":

      for (j = n = 0, ref2 = numCols; 0 <= ref2 ? n < ref2 : n > ref2; j = 0 <= ref2 ? ++n : --n) {

      heatmapper(".pvtVal.col" + j);

      }

      }

      heatmapper(".pvtTotal.rowTotal");

      heatmapper(".pvtTotal.colTotal");

      return this;

      };

      /*

      Barchart post-processing

      */

      return $.fn.barchart = function() {

      var barcharter, i, l, numCols, numRows, ref;

      numRows = this.data("numrows");

      numCols = this.data("numcols");

      barcharter = (function(_this) {

      return function(scope) {

      var forEachCell, max, scaler, values;

      forEachCell = function(f) {

      return _this.find(scope).each(function() {

      var x;

      x = $(this).data("value");

      if ((x != null) && isFinite(x)) {

      return f(x, $(this));

      }

      });

      };

      values = [];

      forEachCell(function(x) {

      return values.push(x);

      });

      max = Math.max.apply(Math, values);

      scaler = function(x) {

      return 100 * x / (1.4 * max);

      };

      return forEachCell(function(x, elem) {

      var text, wrapper;

      text = elem.text();

      wrapper = $("<div>").css({

      "position": "relative",

      "height": "55px"

      });

      wrapper.append($("<div>").css({

      "position": "absolute",

      "bottom": 0,

      "left": 0,

      "right": 0,

      "height": scaler(x) + "%",

      "background-color": "gray"

      }));

      wrapper.append($("<div>").text(text).css({

      "position": "relative",

      "padding-left": "5px",

      "padding-right": "5px"

      }));

      return elem.css({

      "padding": 0,

      "padding-top": "5px",

      "text-align": "center"

      }).html(wrapper);

      });

      };

      })(this);

      for (i = l = 0, ref = numRows; 0 <= ref ? l < ref : l > ref; i = 0 <= ref ? ++l : --l) {

      barcharter(".pvtVal.row" + i);

      }

      barcharter(".pvtTotal.colTotal");

      return this;

      };

      });

      }).call(this);

      //# sourceMappingURL=pivot.js.map

      //var text="Welcome SAPUi5";

  • author's profile photo Former Member
    Former Member
    Posted on Jul 29, 2016 at 07:52 AM

    So if you do not use sap.viz, your app is working fine?

    which version of sapui5 you are using?

    Add a comment
    10|10000 characters needed characters exceeded

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.