@easyv/charts 1.2.1 → 1.2.2

package/lib/components/Axis.js

@@ -1,60 +1,60 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _utils = require("../utils");
-
-var _context = require("../context");
-
-var _element = require("../element");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-var defaultEvent = function defaultEvent() {};
-
-var defaultAlign = {
-  textAnchor: 'middle',
-  dominantBaseline: 'middle'
-};
-var defaultOrientation = 'bottom';
-var defaultTickSize = 6;
-
-var defaultFormatter = function defaultFormatter(d, _ref) {
-  var suffix = _ref.suffix;
-  return d + suffix;
-};
-
-var getAxesPath = function getAxesPath(orientation, _ref2) {
-  var width = _ref2.width,
-      height = _ref2.height;
-
-  switch (orientation) {
-    case 'top':
-    case 'bottom':
-      return 'M-0.5, 0H' + width;
-
-    case 'left':
-    case 'right':
-      return 'M0, -0.5V' + (height + 0.5);
-  }
-};
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _utils = require("../utils");
+
+var _context = require("../context");
+
+var _element = require("../element");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var defaultEvent = function defaultEvent() {};
+
+var defaultAlign = {
+  textAnchor: 'middle',
+  dominantBaseline: 'middle'
+};
+var defaultOrientation = 'bottom';
+var defaultTickSize = 6;
+
+var defaultFormatter = function defaultFormatter(d, _ref) {
+  var suffix = _ref.suffix;
+  return d + suffix;
+};
+
+var getAxesPath = function getAxesPath(orientation, _ref2) {
+  var width = _ref2.width,
+      height = _ref2.height;
+
+  switch (orientation) {
+    case 'top':
+    case 'bottom':
+      return 'M-0.5, 0H' + width;
+
+    case 'left':
+    case 'right':
+      return 'M0, -0.5V' + (height + 0.5);
+  }
+};
 /**
  * 根据坐标轴位置来确定轴标签的垂直对齐方式，水平对齐方式，以及轴标签位于坐标轴的哪个方向
  * @param orientation 坐标轴位置
@@ -65,266 +65,266 @@ var getAxesPath = function getAxesPath(orientation, _ref2) {
  *    directionX,
  *    directionY
  * }
- */
-
-
-var getLayout = function getLayout(orientation, rotate) {
-  switch (orientation) {
-    case 'top':
-      return {
-        dominantBaseline: 'text-after-edge',
-        textAnchor: rotate ? 'end' : 'middle',
-        directionX: 1,
-        directionY: -1
-      };
-
-    case 'bottom':
-      return {
-        dominantBaseline: 'text-before-edge',
-        textAnchor: rotate ? 'start' : 'middle',
-        directionX: 1,
-        directionY: 1
-      };
-
-    case 'left':
-      return {
-        dominantBaseline: 'middle',
-        textAnchor: 'end',
-        directionX: -1,
-        directionY: 1
-      };
-
-    case 'right':
-      return {
-        dominantBaseline: 'middle',
-        textAnchor: 'start',
-        directionX: 1,
-        directionY: 1
-      };
-  }
-};
-
-var AxisLine = function AxisLine(_ref3) {
-  var _ref3$orientation = _ref3.orientation,
-      orientation = _ref3$orientation === void 0 ? defaultOrientation : _ref3$orientation,
-      _ref3$config = _ref3.config,
-      show = _ref3$config.show,
-      color = _ref3$config.color,
-      lineWidth = _ref3$config.lineWidth;
-  if (!show) return null;
-  var context = (0, _react.useContext)(_context.chartContext);
-  return /*#__PURE__*/_react["default"].createElement("path", {
-    d: getAxesPath(orientation, context),
-    stroke: color,
-    strokeWidth: lineWidth
-  });
-};
-
-var Unit = function Unit(_ref4) {
-  var _ref4$config = _ref4.config,
-      show = _ref4$config.show,
-      text = _ref4$config.text,
-      _ref4$config$font = _ref4$config.font,
-      bold = _ref4$config$font.bold,
-      color = _ref4$config$font.color,
-      fontFamily = _ref4$config$font.fontFamily,
-      fontSize = _ref4$config$font.fontSize,
-      italic = _ref4$config$font.italic,
-      letterSpacing = _ref4$config$font.letterSpacing,
-      _ref4$config$translat = _ref4$config.translate,
-      translateX = _ref4$config$translat.x,
-      translateY = _ref4$config$translat.y,
-      _ref4$config$align = _ref4$config.align;
-  _ref4$config$align = _ref4$config$align === void 0 ? defaultAlign : _ref4$config$align;
-  var textAnchor = _ref4$config$align.textAnchor;
-  if (!show) return null;
-  return /*#__PURE__*/_react["default"].createElement("text", {
-    className: "__easyv-unit",
-    transform: 'translate(' + translateX + ', ' + translateY + ')',
-    fontFamily: fontFamily,
-    fontSize: fontSize,
-    fill: color,
-    fontWeight: bold ? 'bold' : 'normal',
-    fontStyle: italic ? 'italic' : 'normal',
-    letterSpacing: letterSpacing,
-    textAnchor: textAnchor
-  }, text);
-};
-
-var Label = function Label(_ref5) {
-  var className = _ref5.className,
-      _ref5$orientation = _ref5.orientation,
-      orientation = _ref5$orientation === void 0 ? defaultOrientation : _ref5$orientation,
-      label = _ref5.label,
-      coordinate = _ref5.coordinate,
-      _ref5$formatter = _ref5.formatter,
-      formatter = _ref5$formatter === void 0 ? defaultFormatter : _ref5$formatter,
-      tickSize = _ref5.tickSize,
-      _ref5$rotate = _ref5.rotate,
-      rotate = _ref5$rotate === void 0 ? 0 : _ref5$rotate,
-      config = _ref5.config,
-      _ref5$onClick = _ref5.onClick,
-      onClick = _ref5$onClick === void 0 ? defaultEvent : _ref5$onClick,
-      _ref5$config = _ref5.config,
-      show = _ref5$config.show,
-      style = _ref5$config.style,
-      _ref5$config$translat = _ref5$config.translate,
-      translateX = _ref5$config$translat.x,
-      translateY = _ref5$config$translat.y,
-      _ref5$config$font = _ref5$config.font,
-      fontFamily = _ref5$config$font.fontFamily,
-      fontSize = _ref5$config$font.fontSize,
-      color = _ref5$config$font.color,
-      bold = _ref5$config$font.bold,
-      italic = _ref5$config$font.italic,
-      letterSpacing = _ref5$config$font.letterSpacing;
-  if (!show) return null;
-
-  var _label = formatter(label, config);
-
-  var _getLayout = getLayout(orientation, rotate),
-      dominantBaseline = _getLayout.dominantBaseline,
-      textAnchor = _getLayout.textAnchor,
-      directionX = _getLayout.directionX,
-      directionY = _getLayout.directionY;
-
-  var isVertical = orientation == 'left' || orientation == 'right';
-  var x = (isVertical ? tickSize * directionX : coordinate) + translateX * directionX;
-  var y = (isVertical ? coordinate : tickSize * directionY) + translateY * directionY;
-  var translateText = 'translate(' + x + ', ' + y + ')';
-
-  var _style = style && ((0, _typeof2["default"])(style) == 'object' ? style : style(_label));
-
-  return /*#__PURE__*/_react["default"].createElement("text", {
-    className: className,
-    style: _objectSpread(_objectSpread({}, _style), {}, {
-      whiteSpace: 'pre'
-    }),
-    onClick: onClick,
-    "data-data": JSON.stringify({
-      x: label
-    }),
-    dominantBaseline: dominantBaseline,
-    textAnchor: textAnchor,
-    fontFamily: fontFamily,
-    fontSize: fontSize,
-    fill: color,
-    fontWeight: bold ? 'bold' : 'normal',
-    fontStyle: italic ? 'italic' : 'normal',
-    letterSpacing: letterSpacing,
-    dx: "0",
-    dy: "0",
-    transform: Array.isArray(_label) ? rotate !== 0 ? isVertical ? translateText + 'rotate(' + rotate + ')' : 'rotate(' + rotate + ', ' + x + ', ' + y + ')' : isVertical ? translateText : 'translate(' + translateX + ', ' + translateY + ')' : translateText + 'rotate(' + rotate + ')'
-  }, !!Array.isArray(_label) ? _label.map(function (item, index) {
-    return /*#__PURE__*/_react["default"].createElement("tspan", {
-      key: index,
-      x: x,
-      dy: "1em"
-    }, item);
-  }) : _label);
-};
-
-var _default = /*#__PURE__*/(0, _react.memo)(function (_ref6) {
-  var orientation = _ref6.orientation,
-      scaler = _ref6.scaler,
-      _ref6$tickSize = _ref6.tickSize,
-      tickSize = _ref6$tickSize === void 0 ? defaultTickSize : _ref6$tickSize,
-      ticks = _ref6.ticks,
-      formatter = _ref6.formatter,
-      rotate = _ref6.rotate,
-      triggerClick = _ref6.triggerClick,
-      _ref6$config = _ref6.config,
-      on = _ref6$config.on,
-      label = _ref6$config.label,
-      axisLine = _ref6$config.axisLine,
-      tickLine = _ref6$config.tickLine,
-      gridLine = _ref6$config.gridLine,
-      unit = _ref6$config.unit,
-      positions = _ref6.positions;
-  if (!(on && ticks.length > 0)) return null;
-
-  var _useContext = (0, _react.useContext)(_context.chartContext),
-      width = _useContext.width,
-      height = _useContext.height;
-
-  var x = orientation == 'right' ? width : 0;
-  var y = orientation == 'bottom' ? height : 0;
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, axisLine && tickLine && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, axisLine && (positions && positions.length ? positions.map(function (_ref7, index) {
-    var x = _ref7.x,
-        y = _ref7.y;
-    return /*#__PURE__*/_react["default"].createElement("g", {
-      key: index,
-      transform: 'translate(' + x + ', ' + y + ')'
-    }, /*#__PURE__*/_react["default"].createElement(AxisLine, {
-      orientation: orientation,
-      config: axisLine
-    }), tickLine && ticks.map(function (tick, index) {
-      var coordinate = scaler(tick);
-      if (isNaN(coordinate)) return null;
-
-      var _tickSize = tickLine.tickSize || tickSize;
-
-      return /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
-        className: "__easyv-tickLine",
-        key: index,
-        config: tickLine
-      }, (0, _utils.getTickCoord)({
-        orientation: orientation,
-        coordinate: coordinate,
-        tickSize: _tickSize
-      })));
-    }));
-  }) : /*#__PURE__*/_react["default"].createElement("g", {
-    transform: 'translate(' + x + ', ' + y + ')'
-  }, /*#__PURE__*/_react["default"].createElement(AxisLine, {
-    orientation: orientation,
-    config: axisLine
-  }), tickLine && ticks.map(function (tick, index) {
-    var coordinate = scaler(tick);
-    if (isNaN(coordinate)) return null;
-
-    var _tickSize = tickLine.tickSize || tickSize;
-
-    return /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
-      className: "__easyv-tickLine",
-      key: index,
-      config: tickLine
-    }, (0, _utils.getTickCoord)({
-      orientation: orientation,
-      coordinate: coordinate,
-      tickSize: _tickSize
-    })));
-  })))), /*#__PURE__*/_react["default"].createElement("g", {
-    transform: 'translate(' + x + ', ' + y + ')'
-  }, label && gridLine && ticks.map(function (tick, index) {
-    var coordinate = scaler(tick);
-    if (isNaN(coordinate)) return null;
-
-    var _tickSize = tickLine.tickSize || tickSize;
-
-    return /*#__PURE__*/_react["default"].createElement("g", {
-      key: index
-    }, label && /*#__PURE__*/_react["default"].createElement(Label, {
-      className: "__easyv-label",
-      orientation: orientation,
-      coordinate: coordinate,
-      config: label,
-      label: tick,
-      tickSize: _tickSize,
-      formatter: formatter,
-      rotate: rotate,
-      onClick: triggerClick
-    }), gridLine && /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
-      className: "__easyv-gridLine",
-      config: gridLine
-    }, (0, _utils.getGridCoord)({
-      orientation: orientation,
-      coordinate: coordinate,
-      end: orientation == 'left' || orientation == 'right' ? width : height
-    }))));
-  }), unit && /*#__PURE__*/_react["default"].createElement(Unit, {
-    config: unit
-  })));
-});
-
+ */
+
+
+var getLayout = function getLayout(orientation, rotate) {
+  switch (orientation) {
+    case 'top':
+      return {
+        dominantBaseline: 'text-after-edge',
+        textAnchor: rotate ? 'end' : 'middle',
+        directionX: 1,
+        directionY: -1
+      };
+
+    case 'bottom':
+      return {
+        dominantBaseline: 'text-before-edge',
+        textAnchor: rotate ? 'start' : 'middle',
+        directionX: 1,
+        directionY: 1
+      };
+
+    case 'left':
+      return {
+        dominantBaseline: 'middle',
+        textAnchor: 'end',
+        directionX: -1,
+        directionY: 1
+      };
+
+    case 'right':
+      return {
+        dominantBaseline: 'middle',
+        textAnchor: 'start',
+        directionX: 1,
+        directionY: 1
+      };
+  }
+};
+
+var AxisLine = function AxisLine(_ref3) {
+  var _ref3$orientation = _ref3.orientation,
+      orientation = _ref3$orientation === void 0 ? defaultOrientation : _ref3$orientation,
+      _ref3$config = _ref3.config,
+      show = _ref3$config.show,
+      color = _ref3$config.color,
+      lineWidth = _ref3$config.lineWidth;
+  if (!show) return null;
+  var context = (0, _react.useContext)(_context.chartContext);
+  return /*#__PURE__*/_react["default"].createElement("path", {
+    d: getAxesPath(orientation, context),
+    stroke: color,
+    strokeWidth: lineWidth
+  });
+};
+
+var Unit = function Unit(_ref4) {
+  var _ref4$config = _ref4.config,
+      show = _ref4$config.show,
+      text = _ref4$config.text,
+      _ref4$config$font = _ref4$config.font,
+      bold = _ref4$config$font.bold,
+      color = _ref4$config$font.color,
+      fontFamily = _ref4$config$font.fontFamily,
+      fontSize = _ref4$config$font.fontSize,
+      italic = _ref4$config$font.italic,
+      letterSpacing = _ref4$config$font.letterSpacing,
+      _ref4$config$translat = _ref4$config.translate,
+      translateX = _ref4$config$translat.x,
+      translateY = _ref4$config$translat.y,
+      _ref4$config$align = _ref4$config.align;
+  _ref4$config$align = _ref4$config$align === void 0 ? defaultAlign : _ref4$config$align;
+  var textAnchor = _ref4$config$align.textAnchor;
+  if (!show) return null;
+  return /*#__PURE__*/_react["default"].createElement("text", {
+    className: "__easyv-unit",
+    transform: 'translate(' + translateX + ', ' + translateY + ')',
+    fontFamily: fontFamily,
+    fontSize: fontSize,
+    fill: color,
+    fontWeight: bold ? 'bold' : 'normal',
+    fontStyle: italic ? 'italic' : 'normal',
+    letterSpacing: letterSpacing,
+    textAnchor: textAnchor
+  }, text);
+};
+
+var Label = function Label(_ref5) {
+  var className = _ref5.className,
+      _ref5$orientation = _ref5.orientation,
+      orientation = _ref5$orientation === void 0 ? defaultOrientation : _ref5$orientation,
+      label = _ref5.label,
+      coordinate = _ref5.coordinate,
+      _ref5$formatter = _ref5.formatter,
+      formatter = _ref5$formatter === void 0 ? defaultFormatter : _ref5$formatter,
+      tickSize = _ref5.tickSize,
+      _ref5$rotate = _ref5.rotate,
+      rotate = _ref5$rotate === void 0 ? 0 : _ref5$rotate,
+      config = _ref5.config,
+      _ref5$onClick = _ref5.onClick,
+      onClick = _ref5$onClick === void 0 ? defaultEvent : _ref5$onClick,
+      _ref5$config = _ref5.config,
+      show = _ref5$config.show,
+      style = _ref5$config.style,
+      _ref5$config$translat = _ref5$config.translate,
+      translateX = _ref5$config$translat.x,
+      translateY = _ref5$config$translat.y,
+      _ref5$config$font = _ref5$config.font,
+      fontFamily = _ref5$config$font.fontFamily,
+      fontSize = _ref5$config$font.fontSize,
+      color = _ref5$config$font.color,
+      bold = _ref5$config$font.bold,
+      italic = _ref5$config$font.italic,
+      letterSpacing = _ref5$config$font.letterSpacing;
+  if (!show) return null;
+
+  var _label = formatter(label, config);
+
+  var _getLayout = getLayout(orientation, rotate),
+      dominantBaseline = _getLayout.dominantBaseline,
+      textAnchor = _getLayout.textAnchor,
+      directionX = _getLayout.directionX,
+      directionY = _getLayout.directionY;
+
+  var isVertical = orientation == 'left' || orientation == 'right';
+  var x = (isVertical ? tickSize * directionX : coordinate) + translateX * directionX;
+  var y = (isVertical ? coordinate : tickSize * directionY) + translateY * directionY;
+  var translateText = 'translate(' + x + ', ' + y + ')';
+
+  var _style = style && ((0, _typeof2["default"])(style) == 'object' ? style : style(_label));
+
+  return /*#__PURE__*/_react["default"].createElement("text", {
+    className: className,
+    style: _objectSpread(_objectSpread({}, _style), {}, {
+      whiteSpace: 'pre'
+    }),
+    onClick: onClick,
+    "data-data": JSON.stringify({
+      x: label
+    }),
+    dominantBaseline: dominantBaseline,
+    textAnchor: textAnchor,
+    fontFamily: fontFamily,
+    fontSize: fontSize,
+    fill: color,
+    fontWeight: bold ? 'bold' : 'normal',
+    fontStyle: italic ? 'italic' : 'normal',
+    letterSpacing: letterSpacing,
+    dx: "0",
+    dy: "0",
+    transform: Array.isArray(_label) ? rotate !== 0 ? isVertical ? translateText + 'rotate(' + rotate + ')' : 'rotate(' + rotate + ', ' + x + ', ' + y + ')' : isVertical ? translateText : 'translate(' + translateX + ', ' + translateY + ')' : translateText + 'rotate(' + rotate + ')'
+  }, !!Array.isArray(_label) ? _label.map(function (item, index) {
+    return /*#__PURE__*/_react["default"].createElement("tspan", {
+      key: index,
+      x: x,
+      dy: "1em"
+    }, item);
+  }) : _label);
+};
+
+var _default = /*#__PURE__*/(0, _react.memo)(function (_ref6) {
+  var orientation = _ref6.orientation,
+      scaler = _ref6.scaler,
+      _ref6$tickSize = _ref6.tickSize,
+      tickSize = _ref6$tickSize === void 0 ? defaultTickSize : _ref6$tickSize,
+      ticks = _ref6.ticks,
+      formatter = _ref6.formatter,
+      rotate = _ref6.rotate,
+      triggerClick = _ref6.triggerClick,
+      _ref6$config = _ref6.config,
+      on = _ref6$config.on,
+      label = _ref6$config.label,
+      axisLine = _ref6$config.axisLine,
+      tickLine = _ref6$config.tickLine,
+      gridLine = _ref6$config.gridLine,
+      unit = _ref6$config.unit,
+      positions = _ref6.positions;
+  if (!(on && ticks.length > 0)) return null;
+
+  var _useContext = (0, _react.useContext)(_context.chartContext),
+      width = _useContext.width,
+      height = _useContext.height;
+
+  var x = orientation == 'right' ? width : 0;
+  var y = orientation == 'bottom' ? height : 0;
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, axisLine && tickLine && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, axisLine && (positions && positions.length ? positions.map(function (_ref7, index) {
+    var x = _ref7.x,
+        y = _ref7.y;
+    return /*#__PURE__*/_react["default"].createElement("g", {
+      key: index,
+      transform: 'translate(' + x + ', ' + y + ')'
+    }, /*#__PURE__*/_react["default"].createElement(AxisLine, {
+      orientation: orientation,
+      config: axisLine
+    }), tickLine && ticks.map(function (tick, index) {
+      var coordinate = scaler(tick);
+      if (isNaN(coordinate)) return null;
+
+      var _tickSize = tickLine.tickSize || tickSize;
+
+      return /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
+        className: "__easyv-tickLine",
+        key: index,
+        config: tickLine
+      }, (0, _utils.getTickCoord)({
+        orientation: orientation,
+        coordinate: coordinate,
+        tickSize: _tickSize
+      })));
+    }));
+  }) : /*#__PURE__*/_react["default"].createElement("g", {
+    transform: 'translate(' + x + ', ' + y + ')'
+  }, /*#__PURE__*/_react["default"].createElement(AxisLine, {
+    orientation: orientation,
+    config: axisLine
+  }), tickLine && ticks.map(function (tick, index) {
+    var coordinate = scaler(tick);
+    if (isNaN(coordinate)) return null;
+
+    var _tickSize = tickLine.tickSize || tickSize;
+
+    return /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
+      className: "__easyv-tickLine",
+      key: index,
+      config: tickLine
+    }, (0, _utils.getTickCoord)({
+      orientation: orientation,
+      coordinate: coordinate,
+      tickSize: _tickSize
+    })));
+  })))), /*#__PURE__*/_react["default"].createElement("g", {
+    transform: 'translate(' + x + ', ' + y + ')'
+  }, label && gridLine && ticks.map(function (tick, index) {
+    var coordinate = scaler(tick);
+    if (isNaN(coordinate)) return null;
+
+    var _tickSize = tickLine.tickSize || tickSize;
+
+    return /*#__PURE__*/_react["default"].createElement("g", {
+      key: index
+    }, label && /*#__PURE__*/_react["default"].createElement(Label, {
+      className: "__easyv-label",
+      orientation: orientation,
+      coordinate: coordinate,
+      config: label,
+      label: tick,
+      tickSize: _tickSize,
+      formatter: formatter,
+      rotate: rotate,
+      onClick: triggerClick
+    }), gridLine && /*#__PURE__*/_react["default"].createElement(_element.Line, (0, _extends2["default"])({
+      className: "__easyv-gridLine",
+      config: gridLine
+    }, (0, _utils.getGridCoord)({
+      orientation: orientation,
+      coordinate: coordinate,
+      end: orientation == 'left' || orientation == 'right' ? width : height
+    }))));
+  }), unit && /*#__PURE__*/_react["default"].createElement(Unit, {
+    config: unit
+  })));
+});
+
 exports["default"] = _default;