@aibsweb/faceted-search/es/components/pivot-table/bubble-scale.js

A generalized faceted search application.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _bubbleCell = _interopRequireDefault(require("./bubble-cell"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

/**
 * This component is meant to be tool tip content for a key to show the relative sizes of bubbles in a bubble chart.
 * @param {Object} props
 * @param {number} maxDataValue - largest value to be represented by a bubble
 * @param {number} maxDiameter - largest diameter of a bubble
 * @param {number} bubbleSteps - number of bubbles to show scale in the key/legend
 */
var BubbleScale = function BubbleScale(_ref) {
  var maxDataValue = _ref.maxDataValue,
      maxDiameter = _ref.maxDiameter,
      bubbleSteps = _ref.bubbleSteps;
  var values = []; // compute bubble scale values in a for-loop
  // using a square scale to get a good spacing between values

  for (var i = 1; i <= bubbleSteps; i += 1) {
    values.push(maxDataValue * Math.pow(i / bubbleSteps, 2));
  }

  return _react["default"].createElement("div", {
    className: 'cell-tooltip cell-tootip__bubble-scale'
  }, values.map(function (count) {
    return _react["default"].createElement("div", {
      className: 'cell-tootip__bubble-scale--item',
      key: "key:".concat(count)
    }, _react["default"].createElement(_bubbleCell["default"], {
      count: count,
      maxDataValue: maxDataValue,
      maxDiameter: maxDiameter
    }), _react["default"].createElement("div", null, Math.round(count)));
  }));
};

var _default = BubbleScale;
exports["default"] = _default;
BubbleScale.propTypes = {
  maxDataValue: _propTypes["default"].number,
  maxDiameter: _propTypes["default"].number,
  bubbleSteps: _propTypes["default"].number
};
BubbleScale.defaultProps = {
  bubbleSteps: 4
};