-2

I'm writing an app, and want my users to be able to upload their images and then have the ability to colorize certain objects in it.

Example: 1. https://www.visualizecolor.com/glidden#/StockPhoto?projectid=f1c432bd-8e17-45b0-93a0-acef22f48d2d 2. https://www.sherwin-williams.com/visualizer#/active

I've tried this solution change particular area of an image and fill color in that area but again I don't know how to adjust the SVG paths when the user uploads a new photo.

George Profenza
  • 48,245
  • 18
  • 139
  • 208
Kristian
  • 42
  • 2
  • 6

1 Answers1

0

Svg Image can be set to the <image> src attribute but to make svg editable like to change color you have to make <object> tag and set source in the data attribute

and after that color can be edited by using

<object class="svgClass" type="image/svg+xml" data="image.svg"></object>

    document.querySelector(".svgClass").getSVGDocument().getElementById("svgInternalID").setAttribute("fill", "red")

How to change fill of svg which is linked using <object> tag in HTML?

Changing SVG image color with javascript

Ahsam Aslam
  • 96
  • 9