解决画布打开图片导出图片分辨率不一值问题

This commit is contained in:
李志鹏
2025-09-25 13:52:05 +08:00
parent 15cb0c86e7
commit 564b75de61
7 changed files with 98 additions and 36 deletions

View File

@@ -456,6 +456,13 @@ onMounted(async () => {
// 使用window的resize事件代替ResizeObserver
// 只有当窗口大小变化时才更新画布尺寸
// window.addEventListener("resize", handleWindowResize);
if(props.config.initZoom) {
const width = canvasManager.width;
const height = canvasManager.height;
const cwidth = props.config.width;
const cheight = props.config.height;
setZoom(Math.min(width/cwidth,height/cheight)); // 设置画布缩放
}
});
watchEffect(() => {
@@ -521,6 +528,19 @@ function resetZoom() {
canvasManager.resetZoom();
}
function setZoom(zoom) {
setTimeout(()=>{
if (!canvasManager) return;
const newZoom = Math.max(zoom / 1.1, 0.1); // 减少10%最小0.1倍
// 使用画布中心作为缩放点
const centerPoint = {
x: canvasManager.canvas.width / 2,
y: canvasManager.canvas.height / 2,
};
canvasManager.animateZoom(centerPoint, newZoom);
})
}
function zoomIn() {
if (!canvasManager) return;
@@ -882,6 +902,7 @@ defineExpose({
layerId = "", // 导出具体图层ID
layerIdArray = [], // 导出多个图层ID数组
expPicType = "png", // 导出图片类型 JPG 或 PNG ,SVG
isEnhanceImg, // 是否是增强图片
} = {}) => {
return canvasManager.exportImage({
isContainBg,
@@ -890,6 +911,7 @@ defineExpose({
layerId,
layerIdArray,
expPicType,
isEnhanceImg,
});
},
/**