Использование графики Html5 / Javascript в некоторых графических редакторах

Question

У меня есть графический дизайн с использованием JavaScript / Html5 Canvas.

Взгляните сюда: http://yeda.us/js/logos.js

Теперь мне нужно передать этот графический элемент графическому дизайнеру.в каком-то формате он может работать: в форматах Photoshop или Illustrator.

Теперь, конечно, я могу сделать снимок экрана и начать свой путь оттуда, но мне нужна эта графика в векторном формате.можно использовать позже более надежно.

Есть ли способ преобразовать вышеупомянутый код в графику?возможно конвертировать его в SVG как-нибудь?

Answer 1

Извлечение SVGCanvas , который определяет API, совместимый с HTML5 canvas, который создает SVG-вывод из команд рисования. Вероятно, он не справляется со всем, но, надеюсь, ваш простой пример будет работать нормально.

Просто вставьте соответствующие биты вашего кода в один из левых текстовых полей и нажмите «сделать это», а затем скопируйте вывод svg из текстового поля справа.

Answer 2

Как прокомментировали другие, нет инструмента, который бы помог вам сделать Canvas -> SVG конвертацию. Тем не менее, код не слишком отличается. Поскольку приведенный вами пример довольно мал, вы можете использовать Raphael.js для генерации SVG и преобразования кода, который вы разместили, в Raphael.js:

http://raphaeljs.com/

UPDATE

Немного подробнее

1. включая Raphael.js
2. постройте свой скрипт построчно и попробуйте найти эквиваленты в Raphael.js. Например, цвет rgb, который вы делаете, будет использовать это: http://raphaeljs.com/reference.html#Raphael.rgb
3. запустить получившийся js
4. сохранить сгенерированный SVG