Мобильная версияПозвольте мне предварить это тем, что я терпеливо писал весь код, используя искусственный интеллект в сочетании с VS Code (в частности, GPT-5, Claude Sonnet 4.5 и Gemini 2.5 Pro).
Это однофайловое веб-приложение, которое позволяет мне создавать карты, сохраните их в локальной базе данных (поскольку я единственный, кто использует приложение, и мне нужна максимально простая настройка), а также импортируйте/экспортируйте базу данных, когда это необходимо. Наконец, он включает кнопку для сохранения карточки в формате PNG.
Файлы SVG были созданы мной с помощью Adobe Illustrator.
В настоящее время программа находится в альфа-версии, в которой я создал текстовый редактор.
Этот текстовый редактор имеет несколько функций, таких как изменение шрифта, размера, подчеркивание, переключение полужирного или полужирного, подчеркивание и т. д.
К сожалению, текст редактор работает некорректно. Например, когда я выделяю текст, удерживая левую кнопку мыши и перетаскивая его, он изменяет весь текстовый атрибут SVG независимо от того, какую часть я на самом деле выбрал.
Вот пример:
Если текст — «EFFETTI:», и я хочу изменить только «-ETTI:», все слово «EFFETTI:» будет изменено.
Та же проблема возникает в другом месте — например, если я пишу «ЭФФЕТТИ: QUESTO È UN EFFETTO». и попробуйте убрать жирный шрифт только из "QUESTO È UN EFFETTO.", к сожалению, "EFFETTI:" тоже потеряет жирное форматирование.
Прошу помощи, поскольку, несмотря на множество подробных подсказок, отправленных различным моделям ИИ, ни одной из них не удалось полностью решить проблему. Каждый раз, когда я применял их предложения, наблюдались как улучшения, так и ухудшения.
Я подозреваю, что настоящие ограничения могут быть связаны с исходной структурой SVG-файла — хотя я не совсем уверен.
Я обратился за помощью к ИИ, потому что мне нужно быстро разработать это веб-приложение, и хотя у меня есть некоторые основы программирования, я не знаю JavaScript или CSS. Я знаю только HTML (хотя начинаю немного понимать CSS).
Так что моя проблема не концептуальная — она лингвистическая: у меня просто нет времени изучать JS сейчас из-за большой загруженности и множества университетских экзаменов, которые отнимают много времени (а я уже отстаю…).
Я рад обсудить и уточнить свой вопрос дальше, потому что меня очень волнует этот небольшой проект — он почти завершен.
Все осталось исправить текстовый редактор, чтобы он работал правильно, и выяснить, как обращаться с цветами (например, иметь возможность изменять цвет границы карточки). Тогда я буду готов.
Еще одна проблема с текстовым редактором заключается в том, что если я выделю часть текста, возникает проблема, описанная ранее.
Но если я ничего не выбираю — я просто нажимаю на точку в тексте, а затем применяю жирный, полужирный, капитель или любое другое форматирование — текст в конечном итоге «схлопывается сам по себе».
Я прикрепил файл веб-приложения — вы можете попробовать. out или откройте его в любом редакторе кода, чтобы просмотреть исходный код.
Я также загрузил два разных подхода к файлу SVG. Первый — с текстовым полем, второй — с прямоугольником.
Код: Выделить всё
>! https://pastebin.com/PkY6amKk
https://pastebin.com/BAn8A4hV
https://pastebin.com/f84nkL7r >!
Я также ожидаю, что текст больше не будет сворачиваться сам по себе.
Я надеюсь, что кто-нибудь поможет мне быстро закончить это. К сожалению, короткие или абстрактные ответы мне не помогут, потому что даже если я пойму логический смысл, я не смогу применить его на практике.
Это потому, что весь код я строил через подсказки ИИ-помощникам, которые генерировали код за меня. Затем, шаг за шагом и все еще посредством подсказок, мне удалось исправить ошибки.
Однако в некоторых случаях я использовал и собственную интуицию — например, когда я замечал циклы ошибок или логические несоответствия, я пытался подсказать ИИ, могут ли они быть причиной проблемы. Благодаря его подтверждению мне удалось решить некоторые проблемы, такие как работа с файлом SVG или отмена потенциально опасных операций в коде или избежание мелких дефектов.
При этом я должен повторить, что я не умею писать код JavaScript или CSS.
То, что мне нужно, — это четкое и упрощенное логическое объяснение, а также практическое руководство — то есть Мне нужен был бы кто-то, кто не только показал бы мне, как решить проблему концептуально, но и предоставил бы точные подсказки для ИИ, шаги, которые необходимо выполнить, или даже прямые изменения в коде для решения двух упомянутых мной проблем.
Подробнее здесь: https://stackoverflow.com/questions/797 ... y-svg-file
