NuclearDispersionSystem/ant-design-vue-jeecg/node_modules/@antv/component/lib/guide/html.js
2023-09-14 14:47:11 +08:00

179 lines
5.5 KiB
JavaScript

function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
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 _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
var Util = require('../util');
var DomUtil = Util.DomUtil;
var Guide = require('./base');
var Html = /*#__PURE__*/function (_Guide) {
_inheritsLoose(Html, _Guide);
var _super = _createSuper(Html);
function Html() {
return _Guide.apply(this, arguments) || this;
}
var _proto = Html.prototype;
_proto.getDefaultCfg = function getDefaultCfg() {
var cfg = _Guide.prototype.getDefaultCfg.call(this);
return Util.mix({}, cfg, {
name: 'html',
zIndex: 7,
position: null,
/**
* Horizontal alignment, can be 'left'、'middle'、'right'
* @type {String}
*/
alignX: 'middle',
/**
* vertical alignment, can be 'top'、'middle'、'bottom'
* @type {String}
*/
alignY: 'middle',
/**
* Horizontal offset
* @type {Number}
*/
offsetX: null,
/**
* Vertical offset
* @type {Number}
*/
offsetY: null,
/**
* html content
*@type {String | Function}
*/
html: null
});
}
/**
* render Html Guide
* @override
* @param {Coordinate} coord the instance of Coordinate class
* @param {Container} container the container which contain the guide component
*/
;
_proto.render = function render(coord, container) {
var self = this;
var position = self.parsePoint(coord, self.get('position'));
if (!position) {
return;
}
var parentNode = container.get('canvas').get('el').parentNode;
var wrapperNode = DomUtil.createDom('<div class="g-guide"></div>');
parentNode.appendChild(wrapperNode);
var html = self.get('htmlContent') || self.get('html');
if (Util.isFunction(html)) {
var xScales = self.get('xScales');
var yScales = self.get('yScales');
html = html(xScales, yScales);
}
var htmlNode = DomUtil.createDom(html);
wrapperNode.appendChild(htmlNode);
DomUtil.modifyCSS(wrapperNode, {
position: 'absolute' // to fix dom in the document stream to get the true width
});
self._setDomPosition(wrapperNode, htmlNode, position);
self.set('el', wrapperNode);
};
_proto._setDomPosition = function _setDomPosition(parentDom, childDom, point) {
var self = this;
var alignX = self.get('alignX');
var alignY = self.get('alignY');
var domWidth = DomUtil.getOuterWidth(childDom);
var domHeight = DomUtil.getOuterHeight(childDom);
var position = {
x: point.x,
y: point.y
};
if (alignX === 'middle' && alignY === 'top') {
position.x -= Math.round(domWidth / 2);
} else if (alignX === 'middle' && alignY === 'bottom') {
position.x -= Math.round(domWidth / 2);
position.y -= Math.round(domHeight);
} else if (alignX === 'left' && alignY === 'bottom') {
position.y -= Math.round(domHeight);
} else if (alignX === 'left' && alignY === 'middle') {
position.y -= Math.round(domHeight / 2);
} else if (alignX === 'left' && alignY === 'top') {
position.x = point.x;
position.y = point.y;
} else if (alignX === 'right' && alignY === 'bottom') {
position.x -= Math.round(domWidth);
position.y -= Math.round(domHeight);
} else if (alignX === 'right' && alignY === 'middle') {
position.x -= Math.round(domWidth);
position.y -= Math.round(domHeight / 2);
} else if (alignX === 'right' && alignY === 'top') {
position.x -= Math.round(domWidth);
} else {
// 默认位于中心点
position.x -= Math.round(domWidth / 2);
position.y -= Math.round(domHeight / 2);
}
var offsetX = self.get('offsetX');
if (offsetX) {
position.x += offsetX;
}
var offsetY = self.get('offsetY');
if (offsetY) {
position.y += offsetY;
}
DomUtil.modifyCSS(parentDom, {
top: Math.round(position.y) + 'px',
left: Math.round(position.x) + 'px',
visibility: 'visible',
zIndex: self.get('zIndex')
});
}
/**
* clear html guide
* @override
*/
;
_proto.clear = function clear() {
var self = this;
var el = self.get('el');
el && el.parentNode && el.parentNode.removeChild(el);
};
return Html;
}(Guide);
module.exports = Html;