cione-comp-lib
Version:
`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`
148 lines (147 loc) • 5.08 kB
JavaScript
import { isObject, each, bind } from "../../../../zrender/lib/core/util.mjs";
import ZRText from "../../../../zrender/lib/graphic/Text.mjs";
import { getPaddingFromTooltipModel } from "./tooltipMarkup.mjs";
import { throwError } from "../../util/log.mjs";
var TooltipRichContent = function() {
function TooltipRichContent2(api) {
this._show = false;
this._styleCoord = [0, 0, 0, 0];
this._enterable = true;
this._zr = api.getZr();
makeStyleCoord(this._styleCoord, this._zr, api.getWidth() / 2, api.getHeight() / 2);
}
TooltipRichContent2.prototype.update = function(tooltipModel) {
var alwaysShowContent = tooltipModel.get("alwaysShowContent");
alwaysShowContent && this._moveIfResized();
};
TooltipRichContent2.prototype.show = function() {
if (this._hideTimeout) {
clearTimeout(this._hideTimeout);
}
this.el.show();
this._show = true;
};
TooltipRichContent2.prototype.setContent = function(content, markupStyleCreator, tooltipModel, borderColor, arrowPosition) {
var _this = this;
if (isObject(content)) {
throwError("");
}
if (this.el) {
this._zr.remove(this.el);
}
var textStyleModel = tooltipModel.getModel("textStyle");
this.el = new ZRText({
style: {
rich: markupStyleCreator.richTextStyles,
text: content,
lineHeight: 22,
borderWidth: 1,
borderColor,
textShadowColor: textStyleModel.get("textShadowColor"),
fill: tooltipModel.get(["textStyle", "color"]),
padding: getPaddingFromTooltipModel(tooltipModel, "richText"),
verticalAlign: "top",
align: "left"
},
z: tooltipModel.get("z")
});
each(["backgroundColor", "borderRadius", "shadowColor", "shadowBlur", "shadowOffsetX", "shadowOffsetY"], function(propName) {
_this.el.style[propName] = tooltipModel.get(propName);
});
each(["textShadowBlur", "textShadowOffsetX", "textShadowOffsetY"], function(propName) {
_this.el.style[propName] = textStyleModel.get(propName) || 0;
});
this._zr.add(this.el);
var self = this;
this.el.on("mouseover", function() {
if (self._enterable) {
clearTimeout(self._hideTimeout);
self._show = true;
}
self._inContent = true;
});
this.el.on("mouseout", function() {
if (self._enterable) {
if (self._show) {
self.hideLater(self._hideDelay);
}
}
self._inContent = false;
});
};
TooltipRichContent2.prototype.setEnterable = function(enterable) {
this._enterable = enterable;
};
TooltipRichContent2.prototype.getSize = function() {
var el = this.el;
var bounding = this.el.getBoundingRect();
var shadowOuterSize = calcShadowOuterSize(el.style);
return [bounding.width + shadowOuterSize.left + shadowOuterSize.right, bounding.height + shadowOuterSize.top + shadowOuterSize.bottom];
};
TooltipRichContent2.prototype.moveTo = function(x, y) {
var el = this.el;
if (el) {
var styleCoord = this._styleCoord;
makeStyleCoord(styleCoord, this._zr, x, y);
x = styleCoord[0];
y = styleCoord[1];
var style = el.style;
var borderWidth = mathMaxWith0(style.borderWidth || 0);
var shadowOuterSize = calcShadowOuterSize(style);
el.x = x + borderWidth + shadowOuterSize.left;
el.y = y + borderWidth + shadowOuterSize.top;
el.markRedraw();
}
};
TooltipRichContent2.prototype._moveIfResized = function() {
var ratioX = this._styleCoord[2];
var ratioY = this._styleCoord[3];
this.moveTo(ratioX * this._zr.getWidth(), ratioY * this._zr.getHeight());
};
TooltipRichContent2.prototype.hide = function() {
if (this.el) {
this.el.hide();
}
this._show = false;
};
TooltipRichContent2.prototype.hideLater = function(time) {
if (this._show && !(this._inContent && this._enterable)) {
if (time) {
this._hideDelay = time;
this._show = false;
this._hideTimeout = setTimeout(bind(this.hide, this), time);
} else {
this.hide();
}
}
};
TooltipRichContent2.prototype.isShow = function() {
return this._show;
};
TooltipRichContent2.prototype.dispose = function() {
this._zr.remove(this.el);
};
return TooltipRichContent2;
}();
function mathMaxWith0(val) {
return Math.max(0, val);
}
function calcShadowOuterSize(style) {
var shadowBlur = mathMaxWith0(style.shadowBlur || 0);
var shadowOffsetX = mathMaxWith0(style.shadowOffsetX || 0);
var shadowOffsetY = mathMaxWith0(style.shadowOffsetY || 0);
return {
left: mathMaxWith0(shadowBlur - shadowOffsetX),
right: mathMaxWith0(shadowBlur + shadowOffsetX),
top: mathMaxWith0(shadowBlur - shadowOffsetY),
bottom: mathMaxWith0(shadowBlur + shadowOffsetY)
};
}
function makeStyleCoord(out, zr, zrX, zrY) {
out[0] = zrX;
out[1] = zrY;
out[2] = out[0] / zr.getWidth();
out[3] = out[1] / zr.getHeight();
}
var TooltipRichContent$1 = TooltipRichContent;
export { TooltipRichContent$1 as default };