jriplotly_renderer.php

(function() {
  var callWithJQuery;

  callWithJQuery = function(pivotModule) {
    if (typeof exports === "object" && typeof module === "object") {
      return pivotModule(require("jquery"), require("plotly.js"));
    } else if (typeof define === "function" && define.amd) {
      return define(["jquery", "plotly.js"], pivotModule);
    } else {
      return pivotModule(jQuery, Plotly);
    }
  };

  callWithJQuery(function($, Plotly) {
    var makejriPlotlyChart, makejriPlotlyScatterChart;
    makejriPlotlyChart = function(traceOptions, layoutOptions, transpose) {
      if (traceOptions == null) {
        traceOptions = {};
      }
      if (layoutOptions == null) {
        layoutOptions = {};
      }
      if (transpose == null) {
        transpose = false;
      }
      return function(pivotData, opts) {
        var colKeys, data, datumKeys, defaults, fullAggName, groupByTitle, hAxisTitle, layout, result, rowKeys, titleText, traceKeys;
        defaults = {
          localeStrings: {
            vs: "per",
            by: "by"
          },
          plotly: {
            with_total: "false",
            with_trendline: "false"
          }
        };
        opts = $.extend(true, {}, defaults, opts);
        rowKeys = pivotData.getRowKeys();
        // rowKeys.push('total');
        colKeys = pivotData.getColKeys();
        traceKeys = transpose ? colKeys : rowKeys;
        if (traceKeys.length === 0) {
          traceKeys.push([]);
        }
        if (opts.plotly.with_total === "true") {
          traceKeys.push(['total'])
        }        
        if (opts.plotly.with_trendline === "true") {
          traceKeys.push(['trendline'])
        }
        datumKeys = transpose ? rowKeys : colKeys;
        if (datumKeys.length === 0) {
          datumKeys.push([]);
        }
        // traceKeys.push('total');
        fullAggName = opts.title;
        if (pivotData.valAttrs.length) {
          fullAggName += "(" + (pivotData.valAttrs.join(", ")) + ")";
        }
        data = traceKeys.map(function(traceKey) {
          var datumKey, i, labels, len, trace, val, values;
          values = [];
          labels = [];
          for (i = 0, len = datumKeys.length; i < len; i++) {
            datumKey = datumKeys[i];

            if (traceKey == 'total') {
              totalAggregator = pivotData.getAggregator([], datumKey);
              val = totalAggregator.value();
            } else if (traceKey == 'trendline') {
              trendAggregator = jri_aggregators.trendLine(datumKey);
              val = trendAggregator.value();
            } else {
              val = parseFloat(pivotData.getAggregator(transpose ? datumKey : traceKey, transpose ? traceKey : datumKey).value());
            }
            values.push(isFinite(val) ? val : 0);
            labels.push(datumKey.join('-') || ' ');
          }
          if (traceKey != 'trendline') {
            trace = {
              name: traceKey.join('-') || fullAggName
            };
          } else {
            trace = {
              name: ''
            };
          }
          
          trace.x = transpose ? values : labels;
          trace.y = transpose ? labels : values;
          return $.extend(trace,  traceOptions);
        });
        if (transpose) {
          hAxisTitle = pivotData.rowAttrs.join("-");
          groupByTitle = pivotData.colAttrs.join("-");
        } else {
          hAxisTitle = pivotData.colAttrs.join("-");
          groupByTitle = pivotData.rowAttrs.join("-");
        }
        titleText = fullAggName;
        if (hAxisTitle !== "") {
          titleText += " " + opts.localeStrings.vs + " " + hAxisTitle;
        }
        if (groupByTitle !== "") {
          titleText += " " + opts.localeStrings.by + " " + groupByTitle;
        }
        layout = {
          title: titleText,
          hovermode: 'closest',
          width: window.innerWidth / 1.4,
          height: window.innerHeight / 1.4 - 50,
          xaxis: {
            title: transpose ? fullAggName : null,
            automargin: true
          },
          yaxis: {
            title: transpose ? null : fullAggName,
            automargin: true
          }
        };
        result = $("<div>").appendTo($("body"));
        Plotly.newPlot(result[0], data, $.extend(layout, layoutOptions, opts.plotly));
        return result.detach();
      };
    };
    makejriPlotlyScatterChart = function() {
      return function(pivotData, opts) {
        var colKey, colKeys, data, defaults, i, j, layout, len, len1, renderArea, result, rowKey, rowKeys, v;
        defaults = {
          localeStrings: {
            vs: "vs",
            by: "by"
          },
          plotly: {}
        };
        opts = $.extend(true, {}, defaults, opts);
        rowKeys = pivotData.getRowKeys();
        if (rowKeys.length === 0) {
          rowKeys.push([]);
        }
        colKeys = pivotData.getColKeys();
        if (colKeys.length === 0) {
          colKeys.push([]);
        }
        data = {
          x: [],
          y: [],
          text: [],
          type: 'scatter',
          mode: 'markers'
        };
        for (i = 0, len = rowKeys.length; i < len; i++) {
          rowKey = rowKeys[i];
          for (j = 0, len1 = colKeys.length; j < len1; j++) {
            colKey = colKeys[j];
            v = pivotData.getAggregator(rowKey, colKey).value();
            if (v != null) {
              data.x.push(colKey.join('-'));
              data.y.push(rowKey.join('-'));
              data.text.push(v);
            }
          }
        }
        layout = {
          title: pivotData.rowAttrs.join("-") + ' vs ' + pivotData.colAttrs.join("-"),
          hovermode: 'closest',
          xaxis: {
            title: pivotData.colAttrs.join('-'),
            domain: [0.1, 1.0]
          },
          yaxis: {
            title: pivotData.rowAttrs.join('-')
          },
          width: window.innerWidth / 1.5,
          height: window.innerHeight / 1.4 - 50
        };
        renderArea = $("<div>", {
          style: "display:none;"
        }).appendTo($("body"));
        result = $("<div>").appendTo(renderArea);
        Plotly.plot(result[0], [data], $.extend(layout, opts.plotly));
        result.detach();
        renderArea.remove();
        return result;
      };
    };
    makejriPlotlyPieChart = function() {
      return function(pivotData, opts) {
        var colKey, colKeys, data, defaults, i, j, layout, len, len1, renderArea, result, rowKey, rowKeys, v;
        defaults = {
          localeStrings: {
            vs: "vs",
            by: "by"
          },
          plotly: {}
        };
        opts = $.extend(true, {}, defaults, opts);
        rowKeys = pivotData.getRowKeys();
        if (rowKeys.length === 0) {
          rowKeys.push([]);
        }
        rowVals = pivotData.rowTotals;
        if (rowVals.length === 0) {
          rowVals.push([]);
        }
        data = {
          values: [],
          labels: [],
          type: 'pie',
        };
        for (i = 0, len = rowKeys.length; i < len; i++) {
          label = rowKeys[i];
          tot = rowVals[label];          
          data.labels.push(label[0]);
          data.values.push(tot.value());
        }
        layout = {
          title: pivotData.rowAttrs.join("-") + ' vs ' + pivotData.colAttrs.join("-"),
          hovermode: 'closest',
 
          width: window.innerWidth / 1.5,
          height: window.innerHeight / 1.4 - 50
        };
        renderArea = $("<div>", {
          style: "display:none;"
        }).appendTo($("body"));
        result = $("<div>").appendTo(renderArea);
        Plotly.plot(result[0], [data], $.extend(layout, opts.plotly));
        result.detach();
        renderArea.remove();
        return result;
      };
    };
    return $.pivotUtilities.jriplotly_renderers = {
      "jripl Horizontal Bar Chart": makejriPlotlyChart({
        type: 'bar',
        orientation: 'h'
      }, {
        barmode: 'group'
      }, true),
      "jripl Horizontal Stacked Bar Chart": makejriPlotlyChart({
        type: 'bar',
        orientation: 'h'
      }, {
        barmode: 'relative'
      }, true),
      "jripl Bar Chart": makejriPlotlyChart({
        type: 'bar'
      }, {
        barmode: 'group'
      }),
      "jripl Stacked Bar Chart": makejriPlotlyChart({
        type: 'bar'
      }, {
        barmode: 'relative'
      }),
      "jripl Pie Chart": makejriPlotlyPieChart(),
      "jripl Line Chart": makejriPlotlyChart(),
      "jripl Scatter Chart": makejriPlotlyScatterChart()
    };
  });

}).call(this);

//# sourceMappingURL=plotly_renderers.js.map