d3plus-shape/es/src/Shape/Bar.js

Fancy SVG shapes for visualizations

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _get(target, property, receiver) { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get; } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(receiver); } return desc.value; }; } return _get(target, property, receiver || target); }

function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

import { accessor, constant } from "d3plus-common";
import Shape from "./Shape";
/**
    @class Bar
    @extends Shape
    @desc Creates SVG areas based on an array of data.
*/

var Bar =
/*#__PURE__*/
function (_Shape) {
  _inherits(Bar, _Shape);

  /**
      @memberof Bar
      @desc Invoked when creating a new class instance, and overrides any default parameters inherited from Shape.
      @private
  */
  function Bar() {
    var _this;

    _classCallCheck(this, Bar);

    _this = _possibleConstructorReturn(this, _getPrototypeOf(Bar).call(this, "rect"));
    _this._name = "Bar";
    _this._height = constant(10);

    _this._labelBounds = function (d, i, s) {
      return {
        width: s.width,
        height: s.height,
        x: _this._x1 !== null ? _this._getX(d, i) : -s.width / 2,
        y: _this._x1 === null ? _this._getY(d, i) : -s.height / 2
      };
    };

    _this._width = constant(10);
    _this._x = accessor("x");
    _this._x0 = accessor("x");
    _this._x1 = null;
    _this._y = constant(0);
    _this._y0 = constant(0);
    _this._y1 = accessor("y");
    return _this;
  }
  /**
      @memberof Bar
      @desc Draws the bars.
      @param {Function} [*callback*]
      @chainable
  */


  _createClass(Bar, [{
    key: "render",
    value: function render(callback) {
      var _this2 = this;

      _get(_getPrototypeOf(Bar.prototype), "render", this).call(this, callback);

      var enter = this._enter.attr("width", function (d, i) {
        return _this2._x1 === null ? _this2._getWidth(d, i) : 0;
      }).attr("height", function (d, i) {
        return _this2._x1 !== null ? _this2._getHeight(d, i) : 0;
      }).attr("x", function (d, i) {
        return _this2._x1 === null ? -_this2._getWidth(d, i) / 2 : 0;
      }).attr("y", function (d, i) {
        return _this2._x1 !== null ? -_this2._getHeight(d, i) / 2 : 0;
      }).call(this._applyStyle.bind(this));

      var update = this._update;

      if (this._duration) {
        enter = enter.transition(this._transition);
        update = update.transition(this._transition);

        this._exit.transition(this._transition).attr("width", function (d, i) {
          return _this2._x1 === null ? _this2._getWidth(d, i) : 0;
        }).attr("height", function (d, i) {
          return _this2._x1 !== null ? _this2._getHeight(d, i) : 0;
        }).attr("x", function (d, i) {
          return _this2._x1 === null ? -_this2._getWidth(d, i) / 2 : 0;
        }).attr("y", function (d, i) {
          return _this2._x1 !== null ? -_this2._getHeight(d, i) / 2 : 0;
        });
      }

      enter.call(this._applyPosition.bind(this));
      update.call(this._applyStyle.bind(this)).call(this._applyPosition.bind(this));
      return this;
    }
    /**
        @memberof Bar
        @desc Given a specific data point and index, returns the aesthetic properties of the shape.
        @param {Object} *data point*
        @param {Number} *index*
        @private
    */

  }, {
    key: "_aes",
    value: function _aes(d, i) {
      return {
        height: this._getHeight(d, i),
        width: this._getWidth(d, i)
      };
    }
    /**
        @memberof Bar
        @desc Provides the default positioning to the <rect> elements.
        @param {D3Selection} *elem*
        @private
    */

  }, {
    key: "_applyPosition",
    value: function _applyPosition(elem) {
      var _this3 = this;

      elem.attr("width", function (d, i) {
        return _this3._getWidth(d, i);
      }).attr("height", function (d, i) {
        return _this3._getHeight(d, i);
      }).attr("x", function (d, i) {
        return _this3._x1 !== null ? _this3._getX(d, i) : -_this3._getWidth(d, i) / 2;
      }).attr("y", function (d, i) {
        return _this3._x1 === null ? _this3._getY(d, i) : -_this3._getHeight(d, i) / 2;
      });
    }
    /**
        @memberof Bar
        @desc Calculates the height of the <rect> by assessing the x and y properties.
        @param {Object} *d*
        @param {Number} *i*
        @private
    */

  }, {
    key: "_getHeight",
    value: function _getHeight(d, i) {
      if (this._x1 !== null) return this._height(d, i);
      return Math.abs(this._y1(d, i) - this._y(d, i));
    }
    /**
        @memberof Bar
        @desc Calculates the width of the <rect> by assessing the x and y properties.
        @param {Object} *d*
        @param {Number} *i*
        @private
    */

  }, {
    key: "_getWidth",
    value: function _getWidth(d, i) {
      if (this._x1 === null) return this._width(d, i);
      return Math.abs(this._x1(d, i) - this._x(d, i));
    }
    /**
        @memberof Bar
        @desc Calculates the x of the <rect> by assessing the x and width properties.
        @param {Object} *d*
        @param {Number} *i*
        @private
    */

  }, {
    key: "_getX",
    value: function _getX(d, i) {
      var w = this._x1 === null ? this._x(d, i) : this._x1(d, i) - this._x(d, i);
      if (w < 0) return w;else return 0;
    }
    /**
        @memberof Bar
        @desc Calculates the y of the <rect> by assessing the y and height properties.
        @param {Object} *d*
        @param {Number} *i*
        @private
    */

  }, {
    key: "_getY",
    value: function _getY(d, i) {
      var h = this._x1 !== null ? this._y(d, i) : this._y1(d, i) - this._y(d, i);
      if (h < 0) return h;else return 0;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the height accessor to the specified function or number and returns the current class instance.
        @param {Function|Number} [*value*]
        @chainable
        @example
    function(d) {
    return d.height;
    }
    */

  }, {
    key: "height",
    value: function height(_) {
      return arguments.length ? (this._height = typeof _ === "function" ? _ : constant(_), this) : this._height;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the width accessor to the specified function or number and returns the current class instance.
        @param {Function|Number} [*value*]
        @chainable
        @example
    function(d) {
    return d.width;
    }
    */

  }, {
    key: "width",
    value: function width(_) {
      return arguments.length ? (this._width = typeof _ === "function" ? _ : constant(_), this) : this._width;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the x0 accessor to the specified function or number and returns the current class instance.
        @param {Function|Number} [*value*]
        @chainable
    */

  }, {
    key: "x0",
    value: function x0(_) {
      if (!arguments.length) return this._x0;
      this._x0 = typeof _ === "function" ? _ : constant(_);
      this._x = this._x0;
      return this;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the x1 accessor to the specified function or number and returns the current class instance.
        @param {Function|Number|null} [*value*]
        @chainable
    */

  }, {
    key: "x1",
    value: function x1(_) {
      return arguments.length ? (this._x1 = typeof _ === "function" || _ === null ? _ : constant(_), this) : this._x1;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the y0 accessor to the specified function or number and returns the current class instance.
        @param {Function|Number} [*value*]
        @chainable
    */

  }, {
    key: "y0",
    value: function y0(_) {
      if (!arguments.length) return this._y0;
      this._y0 = typeof _ === "function" ? _ : constant(_);
      this._y = this._y0;
      return this;
    }
    /**
        @memberof Bar
        @desc If *value* is specified, sets the y1 accessor to the specified function or number and returns the current class instance.
        @param {Function|Number|null} [*value*]
        @chainable
    */

  }, {
    key: "y1",
    value: function y1(_) {
      return arguments.length ? (this._y1 = typeof _ === "function" || _ === null ? _ : constant(_), this) : this._y1;
    }
  }]);

  return Bar;
}(Shape);

export { Bar as default };