Текст перекрывается и сбрасывает положение при рендеринге нескольких фрагментов текста в цикле. ⇐ Javascript

[Anonymous]

Я создаю клиентское приложение («SpeakFlow»), которое принимает большие PDF-файлы, обрабатывает текст частями с помощью LLM для создания Markdown, а затем компилирует эти фрагменты обратно в один новый PDF-файл с помощью jspdf.
Когда приложение завершает обработку и генерирует окончательный PDF-файл, текст из отдельных фрагментов перекрывается. Похоже, что для каждого нового фрагмента курсор записи сбрасывается в верхнюю часть страницы (или в верхнее поле), а не продолжает с того места, где остановился предыдущий фрагмент.
Я прикрепил скриншот проблемы здесь:


Я сохраняю обработанные строки Markdown в массиве (

Код: Выделить всё

app.state.results). Я перебираю этот массив и передаю тот же экземпляр документа

в функцию рендеринга.
Цикл (запуск рендеринга):

Код: Выделить всё

finish: async () => {
// Create the single PDF instance
const doc = new window.jspdf.jsPDF({ unit: 'mm', format: 'a4' });

// app.state.results contains an array of strings (the Markdown chunks)
app.state.results.forEach(res => {
if(res) {
// Pass the doc and the current chunk string to the renderer
app.core.renderMarkdownToPdf(doc, res);
}
});

const pdfBlob = doc.output('blob');
// ... save logic ...
}

Функция рендеринга:
Я подозреваю, что проблема в том, как я вычисляю курсорY. Каждый раз, когда вызывается функция, она инициализирует курсорY на поле, что, как мне кажется, вызывает сброс, но я не уверен, как сохранить состояние курсора при вызовах функций в jspdf.

Код: Выделить всё

renderMarkdownToPdf: (doc, markdownText) => {
const pageWidth = doc.internal.pageSize.getWidth();
const pageHeight = doc.internal.pageSize.getHeight();
const margin = 20;

// PROBLEM SUSPECTED HERE:
// This resets to 20 every time the function is called for a new chunk
let cursorY = margin;

const tokens = marked.lexer(markdownText);

// Helper to write text and handle page breaks
const writeBlock = (text, fontSize, fontStyle, spacingBefore = 0, spacingAfter = 0) => {
doc.setFontSize(fontSize);

// Check if we need a new page before writing
if (cursorY + spacingBefore > pageHeight - margin) {
doc.addPage();
cursorY = margin;
} else {
cursorY += spacingBefore;
}

// Logic to split text and write lines...
const lines = doc.splitTextToSize(text, pageWidth - (margin * 2));

lines.forEach(line => {
// Check if line fits
if (cursorY + lineHeight > pageHeight - margin) {
doc.addPage();
cursorY = margin;
}
doc.text(line, margin, cursorY);
cursorY += lineHeight;
});

cursorY += spacingAfter;
};

// Iterate tokens and call writeBlock...
tokens.forEach(token => {
if (token.type === 'paragraph') {
writeBlock(token.text, 12, 'normal', 0, 4);
}
// ... other token types
});
}

Я разместил действующий проект и исходный код, если вам нужно воспроизвести проблему напрямую:

• Репозиторий GitHub
• Проверьте PDF-файлы, приводящие к перекрытию

Как я могу изменить функцию renderMarkdownToPdf или цикл, чтобы курсорY запоминал свою позицию с момента выполнения предыдущего фрагмента, обеспечить непрерывность потока текста, а не перекрытие вверху страницы? Используемые ключи API можно бесплатно получить в Google ai studio, cerebras и groq

Подробнее здесь: https://stackoverflow.com/questions/798 ... in-a-looph