|
|
@@ -283,12 +283,50 @@
|
|
|
* @author chauncey
|
|
|
*/
|
|
|
function dymamicdragBoundFunc(configWidth: number, configHeight: number) {
|
|
|
- return (pos: { x: number; y: number }) => {
|
|
|
- const RestrictedX = Math.max(0, Math.min(bgConfig.value.width - configWidth, pos.x));
|
|
|
- const RestrictedY = Math.max(0, Math.min(bgConfig.value.height - configHeight, pos.y));
|
|
|
+ return function (pos: { x: number; y: number }) {
|
|
|
+ const scaleX = this.attrs.scaleX;
|
|
|
+ const scaleY = this.attrs.scaleY;
|
|
|
+ const width = cameraIconSize.width;
|
|
|
+ const height = cameraIconSize.height;
|
|
|
+ const rotation = (this.attrs.rotation * Math.PI) / 180; // 转换为弧度
|
|
|
+
|
|
|
+ // 计算旋转和缩放后的四个角点相对于左上角的偏移
|
|
|
+ const points = [
|
|
|
+ { x: 0, y: 0 }, // 左上
|
|
|
+ { x: width * scaleX, y: 0 }, // 右上
|
|
|
+ { x: width * scaleX, y: height * scaleY }, // 右下
|
|
|
+ { x: 0, y: height * scaleY }, // 左下
|
|
|
+ ].map((p) => {
|
|
|
+ // 先应用旋转变换
|
|
|
+ const rotatedX = p.x * Math.cos(rotation) - p.y * Math.sin(rotation);
|
|
|
+ const rotatedY = p.x * Math.sin(rotation) + p.y * Math.cos(rotation);
|
|
|
+ return {
|
|
|
+ x: rotatedX,
|
|
|
+ y: rotatedY,
|
|
|
+ };
|
|
|
+ });
|
|
|
+
|
|
|
+ // 计算变换后的边界框
|
|
|
+ const minX = Math.min(...points.map((p) => p.x));
|
|
|
+ const maxX = Math.max(...points.map((p) => p.x));
|
|
|
+ const minY = Math.min(...points.map((p) => p.y));
|
|
|
+ const maxY = Math.max(...points.map((p) => p.y));
|
|
|
+
|
|
|
+ // 计算边界框的尺寸
|
|
|
+ const boxWidth = maxX - minX;
|
|
|
+ const boxHeight = maxY - minY;
|
|
|
+
|
|
|
+ // 计算相对于变换原点的偏移
|
|
|
+ const offsetX = -minX;
|
|
|
+ const offsetY = -minY;
|
|
|
+
|
|
|
+ // 限制位置,确保完全在画布内
|
|
|
+ const restrictedX = Math.max(0 + offsetX, Math.min(bgConfig.value.width - boxWidth + offsetX, pos.x));
|
|
|
+ const restrictedY = Math.max(0 + offsetY, Math.min(bgConfig.value.height - boxHeight + offsetY, pos.y));
|
|
|
+
|
|
|
return {
|
|
|
- x: RestrictedX,
|
|
|
- y: RestrictedY,
|
|
|
+ x: restrictedX,
|
|
|
+ y: restrictedY,
|
|
|
};
|
|
|
};
|
|
|
}
|