OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

JS: Accessing paths on loaded SVG image, to change colours, before draing to document

  • Thread starter Thread starter Paul
  • Start date Start date
P

Paul

Guest
I have an svg that has multiple paths inside that I want to manipulate the colours before drawing into the document:

In the SVG I have

Code:
  <path id="pathHair01" ....
 <path id="pathBody01" ....
 <path id="pathMain01" ......

and IM loading this with

Code:
    let img= new Image()
    img.id = 'myImg'
    img.src = 'myImage.svg'

before I draw using

Code:
ctx.drawImage(img, leftPoint, topPoint, newWidth, newHeight)

I want to manipulate the colours of my paths . g How can I access the paths of .img before drawint it to the document? (Ie I dont think I can use document.getElementById(img.id) since it hasnt yet been drawn to the document ?

<p>I have an svg that has multiple paths inside that I want to manipulate the colours before drawing into the document:</p>
<p>In the SVG I have</p>
<pre><code> <path id="pathHair01" ....
<path id="pathBody01" ....
<path id="pathMain01" ......
</code></pre>
<p>and IM loading this with</p>
<pre><code> let img= new Image()
img.id = 'myImg'
img.src = 'myImage.svg'
</code></pre>
<p>before I draw using</p>
<pre><code>ctx.drawImage(img, leftPoint, topPoint, newWidth, newHeight)
</code></pre>
<p>I want to manipulate the colours of my paths . g
How can I access the paths of .img before drawint it to the document?
(Ie I dont think I can use document.getElementById(img.id) since it hasnt yet been drawn to the document ?</p>
 

Latest posts

B
Replies
0
Views
1
Blundering Ecologist
B
Top