Во-первых, я считаю, что моя просьба довольно «амбициозна», но любая помощь очень ценится, так как я не уверен, что лучше всего продолжить.
На моем сайте (построенном с PHP / MySQL) после того, как пользователь загрузил PDF, я хотел бы отобразить PDF-файл на странице (я предполагаю, что в iFrame). Затем мне нужно, чтобы они могли вытащить несколько «ящиков» поверх PDF (я предполагаю с jQuery). Затем мне нужно записать координаты этого окна, чтобы позже я смог повторно создать PDF-файл, в который вставлялся новый текст в определенные «ящики».
Является ли это возможным? Если не то, что еще вы бы предложили? (пожалуйста, не говорите imagemagick!)
Я знаю, как воссоздать PDF-файл, вводящий новый текст, но моя проблема заключается в том, как разрешить пользователю записывать эти координаты.
Вы можете использовать PDF.js для рендеринга PDF на странице. PDF.js отобразит его как часть страницы, чтобы вы могли присоединять события и взаимодействовать с ним так, как не могли, если он отображается в плагине Acrobat.
Я не мог найти существующую библиотеку для получения координат, поэтому я использовал этот код для его реализации.
Живая демонстрация кода выбора
$(function () { "use strict"; var startX, startY, selectedBoxes = [], $selectionMarquee = $('#selectionMarquee'), positionBox = function ($box, coordinates) { $box.css( 'top', coordinates.top ).css( 'left', coordinates.left ).css( 'height', coordinates.bottom - coordinates.top ).css( 'width', coordinates.right - coordinates.left ); }, compareNumbers = function (a, b) { return a - b; }, getBoxCoordinates = function (startX, startY, endX, endY) { var x = [startX, endX].sort(compareNumbers), y = [startY, endY].sort(compareNumbers); return { top: y[0], left: x[0], right: x[1], bottom: y[1] }; }, trackMouse = function (event) { var position = getBoxCoordinates(startX, startY, event.pageX, event.pageY); positionBox($selectionMarquee, position); }; $(document).on('mousedown', function (event) { startX = event.pageX; startY = event.pageY; positionBox($selectionMarquee, getBoxCoordinates(startX, startY, startX, startY)); $selectionMarquee.show(); $(this).on('mousemove', trackMouse); }).on('mouseup', function (event) { var position, $selectedBox; $selectionMarquee.hide(); position = getBoxCoordinates(startX, startY, event.pageX, event.pageY); if (position.left !== position.right && position.top !== position.bottom) { $selectedBox = $('<div class="selected-box"></div>'); $selectedBox.hide(); $('body').append($selectedBox); positionBox($selectedBox, position); $selectedBox.show(); selectedBoxes.push(position); $(this).off('mousemove', trackMouse); } }); }); Вам нужно будет настроить его, чтобы получить координаты, относящиеся к PDF, после его отображения, но это должно привести вас к правильному пути.