@springernature/nn-charts/dist/utils/column-transition.js

Visualization for DAS products

"use strict";

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.transitionStacked = exports.transitionPercent = exports.transitionGrouped = void 0;
var d3 = _interopRequireWildcard(require("d3"));
var _common = require("./common");
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
/*
  name: transitionPercent
  description: function to transition chart to percentage contribution of whole form
  arguments: none
  returns: none
  calls: none
  called from: changeChart
  */
var transitionPercent = exports.transitionPercent = function transitionPercent(xAxisScale, yAxisScale, rectBars, svg, position_yAxis) {
  //
  // update definition of y-axis
  yAxisScale.domain([0, 1]);
  var formatPercent = d3.format(".0%");
  position_yAxis.tickFormat(formatPercent);

  // transition all data rectangles accordingly
  rectBars.transition().duration(500).delay(function (d, i) {
    return i * 10;
  }).attr("y", function (d) {
    var total = d3.sum(d3.values(d.data));
    return yAxisScale(d[1] / total);
  }).attr("height", function (d) {
    var total = d3.sum(d3.values(d.data));
    return yAxisScale(d[0] / total) - yAxisScale(d[1] / total);
  }).transition().attr("x", function (d, i) {
    return xAxisScale(i);
  }).attr("width", xAxisScale.bandwidth());

  // update format of y-axis tick labels.
  // position_yAxis.tickFormat(function (d, i) {
  //   return Number(d * 100) + "%";
  // });

  // transition y-axis
  svg.selectAll(".axis.y-axis").transition().delay(500).duration(500).call(position_yAxis);
  return;
}; // end function transitionPercent

/*
  name: transitionGrouped
  description: function to transition chart to grouped form
  arguments: none
  returns: none
  calls: none
  called from: changeChart
*/
var transitionGrouped = exports.transitionGrouped = function transitionGrouped(xAxisScale, yAxisScale, rectBars, svg, position_yAxis, el, yGroupMax, dataCategoryLength) {
  //
  // update definition of y-axis
  yAxisScale.domain([0, Math.ceil(yGroupMax / (0, _common.getValueUpperLimit)(yGroupMax)) * (0, _common.getValueUpperLimit)(yGroupMax)]);

  // transition all data rectangles accordingly
  rectBars.transition().duration(500).delay(function (d, i) {
    return i * 10;
  }).attr("x", function (d, i, j) {
    return xAxisScale(i) + xAxisScale.bandwidth() / dataCategoryLength * parseInt(this.parentNode.id);
  }).attr("width", xAxisScale.bandwidth() / dataCategoryLength).transition().attr("y", function (d, i) {
    return el.config.chartHeight - (yAxisScale(d[0]) - yAxisScale(d[1]));
  }).attr("height", function (d, i) {
    return yAxisScale(d[0]) - yAxisScale(d[1]);
  });

  // update tick label format
  // el.articles.yAxis.tickFormat(el.articles.formatNumber);

  // update format of y-axis tick labels.
  position_yAxis.tickFormat(function (d, i) {
    return (0, _common.numberWithCommas)(Number(d));
  });

  // transition y-axis
  svg.selectAll(".axis.y-axis").transition().delay(500).duration(500).call(position_yAxis);
  return;
}; // end function transitionGrouped

/*
    name: transitionStacked
    description: function to transition chart to Stacked form 
    */
var transitionStacked = exports.transitionStacked = function transitionStacked(xAxisScale, yAxisScale, rectBars, svg, position_yAxis, el, yStackMax) {
  //
  // update definition of y-axis
  yAxisScale.domain([0, Math.ceil(yStackMax / (0, _common.getValueUpperLimit)(yStackMax)) * (0, _common.getValueUpperLimit)(yStackMax)]);
  //
  // transition all data rectangles accordingly
  rectBars.transition().duration(500).delay(function (d, i) {
    return i * 10;
  }).attr("y", function (d) {
    return yAxisScale(d[1]);
  }).attr("height", function (d) {
    return yAxisScale(d[0]) - yAxisScale(d[1]);
  }).transition().attr("x", function (d, i) {
    return xAxisScale(i);
  }).attr("width", xAxisScale.bandwidth());

  // now does not work in ES6. d3.format() is not accepted as a d3 function. not recognised.
  // update tick label format
  // el.articles.yAxis.tickFormat(el.articles.formatNumber);

  // update format of y-axis tick labels.
  position_yAxis.tickFormat(function (d, i) {
    return (0, _common.numberWithCommas)(Number(d));
  });

  // transition y-axis
  svg.selectAll(".axis.y-axis").transition().delay(500).duration(500).call(position_yAxis);
  return;
}; // end function transitionStacked