@antv/f2
Version:
Charts for mobile visualization.
50 lines • 1.45 kB
JavaScript
import { __assign } from "tslib";
import { jsx } from '@antv/f-engine';
import { deepMix, isNumber } from '@antv/util';
var defaultProps = {
offsetX: 0,
offsetY: 0,
points: [],
src: ''
};
export default (function (props, context) {
var cfg = deepMix({}, defaultProps, props);
var points = cfg.points,
style = cfg.style,
attrs = cfg.attrs,
offsetX = cfg.offsetX,
offsetY = cfg.offsetY,
src = cfg.src,
animation = cfg.animation;
var _a = points[0] || {},
x = _a.x,
y = _a.y;
if (isNaN(x) || isNaN(y)) return null;
var _b = __assign(__assign({}, attrs), style),
_c = _b.height,
height = _c === void 0 ? 0 : _c,
_d = _b.width,
width = _d === void 0 ? 0 : _d;
var heightNum = isNumber(height) ? context.px2hd(height + 'px') : context.px2hd(height);
var widthNum = isNumber(width) ? context.px2hd(width + 'px') : context.px2hd(width);
var offsetXNum = context.px2hd(offsetX);
var offsetYNum = context.px2hd(offsetY);
var posX = x + (offsetXNum || 0) - widthNum / 2;
var posY = y + (offsetYNum || 0) - heightNum / 2;
return jsx("group", null, jsx("image", {
style: __assign(__assign(__assign({}, attrs), style), {
height: heightNum,
width: widthNum,
x: posX,
y: posY,
src: src
}),
animation: deepMix({
update: {
easing: 'linear',
duration: 450,
property: ['x', 'y']
}
}, animation)
}));
});