Оптимальный способ реализации онлайн-раскраски?

Question

[thetonygreen]

Привет всем!

Как по-вашему оптимальней всего реализовать онлайн раскраску?

Исходные данные: много svg, но с единым контуром (на подобие того: i.imgur.com/IZCNmEm.png)

Беглое гугление показало способы раскраски svg по контурам, только если изображение их содержит, как например тут: i.imgur.com/bsFqpch.png, i.imgur.com/Wk6J25O.png (выделены красным)

Можно ли как-то преобразовать исходный svg (https://yadi.sk/d/vZPbs5Ok3LJVW4) с одним единым контуром в svg с несколькими (https://yadi.sk/d/EXUjtPVR3LJVWs)? Если да, только вручную?

===

Другой способ: онлайн-редактор изображений с функцией заливки (типа www.sumopaint.com/home/#app), позволяют даже jpg заливать по отдельным кускам как в ФШ. Проблема в том, что не нашел свободного онлайн-редактора, который можно было бы встроить в сайт с уже загруженной картинкой для раскраски и отключив при этому весь другой функционал. Может вы знаете такой?

Спасибо

Comments

[napa3um]

Не очень понятно, что вам нужно. Онлайн-раскраска как себя вести должна? Просто заливка должна срабатывать при тычке мышью в область, ограниченную контуром? Тогда я бы делал так: в векторном графическом редакторе рисовал бы раскрашенную картинку, а при выводе на веб-странице заменял бы все цвета кроме чёрного на белый, а в onclick этих элементов сделал бы возврат старого цвета (или выбранного пользователем).

[thetonygreen]

napa3um: да, просто заливка при клике мышкой в область, ограниченную контуром.

Спасибо за вариант

[marispaberzs]

здравствуйте вы решили свою проблему? нашли решение?