Как программно извлечь XML-данные из draw.io PNG
Короче говоря, я хочу иметь возможность извлекать XML-данные из PNG, сохраненного из draw.io, с помощью PHP или JavaScript в браузере.
Я использую изображения draw.io со слоями для документирования физических соединений между сетевыми устройствами. Сайт документации — это внутренний сайт, на котором запущен экземпляр докувики, на который у меня нет прав администратора. Я могу загружать экспортированные файлы PNG на сайт, но мне не разрешено загружать файлы TXT, XML или SVG. По какой-то причине я могу встраивать HTML, PHP и JavaScript на страницы. Я нахожусь на том этапе, когда могу вставить код встраивания HTML, но это значительно замедляет работу браузера при редактировании страницы до такой степени, что я не могу вносить какие-либо дальнейшие изменения после вставки кода вставки.
Мое предполагаемое решение для этого состояло бы в том, чтобы использовать PHP или JavaScript для извлечения данных XML из загруженного PNG. В значительной степени противоположно это спросить. Затем я вставил бы его в код для встраивания на странице.
Вот код для встраивания, который я бы использовал:
<div
class = "mxgraph"
style = "max-width:100%;border:1px solid transparent;"
data-mxgraph = "{"highlight":"#0000ff","nav":true,"resize":true,"toolbar":"zoom layers lightbox","edit":"_blank","xml":"_INSERT_XML_DATA_HERE_"}">
</div>
<script
type = "text/javascript"
src = "https://www.draw.io/js/viewer.min.js">
</script>
Я недостаточно знаю JavaScript, чтобы понять, как draw.io может сделать это при открытии из PNG, но некоторый пример кода о том, как это работает, или даже ссылка на то, где это происходит в исходном коде, были бы полезны.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
XML-данные не могут быть извлечены из PNG, так как это растеризованные сжатые пиксельные данные. Я думаю, что формат, который вы ищете, - это SVG, который представляет собой формат изображения на основе XML. Используя изображение SVG, вы сможете делать все, что вам нужно, с XML внутри файла или просто загрузить файл svg.
В draw.io вам нужно будет экспортировать в формате svg.
Файл > Экспортировать как > SVG...
Надеюсь это поможет.
Кроме того, в экспортированном PNG должны быть какие-то XML-данные, поскольку я могу повторно загрузить PNG в draw.io, чтобы внести дополнительные изменения.
Мы встраиваем данные диаграммы в сжатый текстовый раздел PNG (ZTXT).
формат png встраивает код xml (если вы выберете его) about.draw.io/выберите формат-экспорт-диаграммы
Если Draw.io может, то и вы сможете! Но я думаю, что это возможно, только если вы выбрали опцию Include a copy of my diagram при экспорте в PNG. С помощью этой опции Draw.io сохраняет дополнительные данные в формате PNG (вы можете посмотреть файл записьGraphModelToPng.
Но интереснее для вас будет извлечьGraphModelFromPng
Да, похоже, это то, что мне нужно. Я попробую и посмотрю, смогу ли я заставить его работать.
Просто предоставив немного больше информации. В PNG вроде как можно хранить "текстовые комментарии" - en.wikipedia.org/wiki/Portable_Network_Graphics. В частности, обратите внимание на поле zTXt. На 2 файла исходного кода, упомянутые выше, есть ссылка zTXt внутри. Стечение обстоятельств? Думаю, нет :)
Это решило бы мою проблему, если бы сайт документации позволил мне загружать SVG. Я только что попробовал, и это не так. Я обязательно включу это в свой вопрос.