Light/shadow Simulation

View: New views
3 Messages — Rating Filter:   Alert me  

Light/shadow Simulation

by Marek Scholaster-2 :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

Hello,

I'm not sure I'm able to explain my problem, but will try:

I have a raster image representing plain texture. Let's say a textile
fabric.
Now I want to simulate a distortion of that texture (so part will be
lighter and part darker - simulating shadow)
In a case of fabric imagine a fabric on a table and put a long pencil
under the fabric (straight linear object to make it simpler to start)

So I have:
- the raster image
- position of the pencil (line)
- width of the pencil
and need to simulate light/shadow around that line.

I guess it is a job for filters but I've not enough knowledge to make it.  

Thank you for any hint.

Marek

Re: Light/shadow Simulation

by root2art :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

hi marek,

have you tried something like this:

<?xml version="1.0" encoding="UTF-8"?>
<svg width="200px" height="200px" viewBox="0 0 200 200"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">

<defs>  
    <linearGradient id="shadow" x1="0%" y1="0%" x2="0%" y2="100%" >
     <stop offset="0" stop-opacity="0" stop-color="white"/>
     <stop offset="0.45" stop-opacity="0.5" stop-color="white"/>
     <stop offset="0.55" stop-opacity="0.5" stop-color="black"/>
     <stop offset="1" stop-opacity="0" stop-color="black"/>
    </linearGradient>
</defs>

 <g>
   <image xlink:href="texture.png" x="0" y="0" width="200" height="200" />
   <rect fill="url(#shadow)" x="0" y="0" width="200" height="200"   />
   </g>
   </svg>

cheers

harvey

--- In svg-developers@..., Marek Scholaster <scholaster@...> wrote:

>
> Hello,
>
> I'm not sure I'm able to explain my problem, but will try:
>
> I have a raster image representing plain texture. Let's say a textile
> fabric.
> Now I want to simulate a distortion of that texture (so part will be
> lighter and part darker - simulating shadow)
> In a case of fabric imagine a fabric on a table and put a long pencil
> under the fabric (straight linear object to make it simpler to start)
>
> So I have:
> - the raster image
> - position of the pencil (line)
> - width of the pencil
> and need to simulate light/shadow around that line.
>
> I guess it is a job for filters but I've not enough knowledge to make it.  
>
> Thank you for any hint.
>
> Marek
>



Re: Light/shadow Simulation

by Marek Scholaster-2 :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

Thanks Harvey,
this way is perfect for simulation of 3D shape but there is a problem with colors. The black and white in the gradient change color of the original pattern.
I tried to replace black and white with a dark and light version of average pattern color. It was better but still not perfect.
Instead of merging background color with another color it should just make the background color darker/lighter.
Marek

--- In svg-developers@..., "root2art" <h_@...> wrote:

>
> hi marek,
>
> have you tried something like this:
>
> <?xml version="1.0" encoding="UTF-8"?>
> <svg width="200px" height="200px" viewBox="0 0 200 200"
>      xmlns="http://www.w3.org/2000/svg"
>      xmlns:xlink="http://www.w3.org/1999/xlink">
>
> <defs>  
>     <linearGradient id="shadow" x1="0%" y1="0%" x2="0%" y2="100%" >
>      <stop offset="0" stop-opacity="0" stop-color="white"/>
>      <stop offset="0.45" stop-opacity="0.5" stop-color="white"/>
>      <stop offset="0.55" stop-opacity="0.5" stop-color="black"/>
>      <stop offset="1" stop-opacity="0" stop-color="black"/>
>     </linearGradient>
> </defs>
>
>  <g>
>    <image xlink:href="texture.png" x="0" y="0" width="200" height="200" />
>    <rect fill="url(#shadow)" x="0" y="0" width="200" height="200"   />
>    </g>
>    </svg>
>
> cheers
>
> harvey
>
> --- In svg-developers@..., Marek Scholaster <scholaster@> wrote:
> >
> > Hello,
> >
> > I'm not sure I'm able to explain my problem, but will try:
> >
> > I have a raster image representing plain texture. Let's say a textile
> > fabric.
> > Now I want to simulate a distortion of that texture (so part will be
> > lighter and part darker - simulating shadow)
> > In a case of fabric imagine a fabric on a table and put a long pencil
> > under the fabric (straight linear object to make it simpler to start)
> >
> > So I have:
> > - the raster image
> > - position of the pencil (line)
> > - width of the pencil
> > and need to simulate light/shadow around that line.
> >
> > I guess it is a job for filters but I've not enough knowledge to make it.  
> >
> > Thank you for any hint.
> >
> > Marek
> >
>