|
|
@@ -268,6 +268,18 @@ export const limitSingleSvgPageHeight = () => {
|
|
|
|
|
|
}
|
|
|
|
|
|
+const isElementInViewport = (el: any) => {
|
|
|
+ const rect = el.getBoundingClientRect();
|
|
|
+ return (
|
|
|
+ rect.top >= 0 &&
|
|
|
+ rect.left >= 0 &&
|
|
|
+ rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
|
|
|
+ rect.right <= (window.innerWidth || document.documentElement.clientWidth)
|
|
|
+ );
|
|
|
+}
|
|
|
+const isNumeric = (str: any) => {
|
|
|
+ return /^\d+$/.test(str);
|
|
|
+ }
|
|
|
// 谱面优化
|
|
|
export const resetFormate = () => {
|
|
|
container.value = document.getElementById('scrollContainer')
|
|
|
@@ -296,14 +308,23 @@ export const resetFormate = () => {
|
|
|
const paths: SVGAElement[] = Array.from(staffline.querySelectorAll(".vf-measure > .vf-stave path"));
|
|
|
const dotModifiers: SVGAElement[] = Array.from(staffline.querySelectorAll(".vf-measure .vf-stopDot"));
|
|
|
const staves: SVGAElement[] = Array.from(staffline.querySelectorAll(".vf-measure > .vf-stave"));
|
|
|
+ const numberVfTexts = Array.from((container.value as HTMLElement).querySelectorAll(".vf-text > text"));
|
|
|
|
|
|
// 获取第一个线谱的y轴坐标
|
|
|
const firstLinePathY = paths[0]?.getBBox().y || 0
|
|
|
+ // D.C循环标记没有显示完全修复
|
|
|
// 反复标记 和 小节碰撞
|
|
|
- const repetWord = ["To Coda", "D.S. al Coda", "Coda"];
|
|
|
+ const repetWord = ["To Coda", "D.S. al Coda", "Coda", "D.C."];
|
|
|
texts
|
|
|
.filter((n) => repetWord.includes(n.textContent || ""))
|
|
|
.forEach((t) => {
|
|
|
+ // console.log('文本123',t.textContent,'是否在可视区域内',isElementInViewport(t))
|
|
|
+ // D.C循环标记不在可视区域内，需要修复移动其位置信息
|
|
|
+ if (t.textContent?.includes('D.C')) {
|
|
|
+ if (!isElementInViewport(t)) {
|
|
|
+ t.style.transform = `translateX(-40px)`;
|
|
|
+ }
|
|
|
+ }
|
|
|
vfbeams.forEach((curve) => {
|
|
|
const result = collisionDetection(t, curve);
|
|
|
const prePath: SVGAElement = t?.previousSibling as unknown as SVGAElement;
|
|
|
@@ -430,13 +451,14 @@ export const resetFormate = () => {
|
|
|
label.textContent = labelText.replace('#','♯')
|
|
|
}
|
|
|
});
|
|
|
- dotModifiers.forEach((group: any) => {
|
|
|
- if (state.musicRenderType === 'fixedTone') {
|
|
|
- group.setAttribute('transform', 'translate(3,-12)')
|
|
|
- } else {
|
|
|
- group.setAttribute('transform', 'translate(3,-7)')
|
|
|
- }
|
|
|
- });
|
|
|
+ // numberVfTexts.forEach((label: any) => {
|
|
|
+ // const labelText = label.textContent as string
|
|
|
+ // if (isNumeric(labelText)) {
|
|
|
+ // const _y = Number(label.getAttribute("y"))
|
|
|
+ // const endY = firstLinePathY ? firstLinePathY - musicalDistance : _y
|
|
|
+ // label.setAttribute("y", endY)
|
|
|
+ // }
|
|
|
+ // })
|
|
|
const vftextBottom = Array.from(staffline.querySelectorAll(".vf-text > text")).filter((n: any) => n.getBBox().y > stafflineCenter);
|
|
|
const vflineBottom = Array.from(staffline.querySelectorAll(".vf-line")).filter((n: any) => n.getBBox().y > stafflineCenter);
|
|
|
// 去重
|
|
|
@@ -614,6 +636,25 @@ export const resetFormate = () => {
|
|
|
state.vfmeasures = state.vfmeasures.concat(vfmeasures);
|
|
|
}
|
|
|
|
|
|
+ dotModifiers.forEach((group: any) => {
|
|
|
+ let parent = group?.parentElement; // 获取父元素
|
|
|
+ // 如果需要找更外层的祖先元素，可以一直迭代
|
|
|
+ while (parent && !parent.classList?.contains('vf-measure') && parent.tagName !== 'body' && parent) { // 假设你想找到最外层的 DIV
|
|
|
+ parent = parent.parentElement;
|
|
|
+ }
|
|
|
+ const parentY = parent?.querySelector('.vf-custom-bg').getBoundingClientRect()?.y || 0;
|
|
|
+ const dotY = group?.getBoundingClientRect()?.y || 0;
|
|
|
+ const distanceY = parentY - dotY;
|
|
|
+ const translateY = 15 - distanceY;
|
|
|
+ // console.log('距离111',translateY)
|
|
|
+ group.setAttribute('transform', `translate(3,${-translateY})`)
|
|
|
+ // if (state.musicRenderType === 'fixedTone') {
|
|
|
+ // // group.setAttribute('transform', 'translate(3,-12)')
|
|
|
+ // } else {
|
|
|
+ // // group.setAttribute('transform', 'translate(3,-7)')
|
|
|
+ // }
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
if (!state.isCombineRender && state.isSingleLine) {
|
|
|
transSinglePage();
|
