[solved] Gradient to Path

Post questions on how to use or achieve an effect in Inkscape.
User avatar
brynn
Posts: 10309
Joined: Wed Sep 26, 2007 4:34 pm
Location: western USA
Contact:

[solved] Gradient to Path

Postby brynn » Thu Jul 03, 2008 5:47 pm

Hi
I've been trying to use the Gradient to Path technique, from this tutorial, which jude mentioned in a different topic thread (viewtopic.php?f=6&t=1175). I'm having some difficulty with it, though, and am unsure how to get help with it. If I spoke German, of course I would join the German Inkscape Forum and post a topic asking for help, there. But alas, no German :roll:

So I'm gonna go ahead and post my questions and screen shot here, and hope some of the bright Inkscape users here, can help me. If not though, can you suggest how I might get help with this?

Here's a link to a screen shot (it's a bit large to insert into this message). So you can see that where the path curves, the markers overlap. And since they have an alpha value, the overlap results in darker and lighter areas, instead of the smooth appearance shown in the tutorial. Not only are the overlapped areas a problem, but on the other side of the path, the markers are spaced farther apart, resulting in gaps in the gradient/path.

What have I done wrong? Do I need more nodes, less nodes? Should the marker be wider, thinner? I thought I understood from the tutorial that transparency can be used, but maybe I misunderstood -- maybe the marker has to be opaque? Or maybe I need to try a different shape for the marker? I tried some of the various marker shapes that are included, (circles, dots, arrows, etc.) but they would not take on the gradient. I'm thinking I could convert a letter 'S' to path, add the gradient, and use it for the marker. Maybe the 'S' shape would help with the gaps....but they'd make the overlaps worse.

One problem that I've noted, is that when I used Effects > Modify Path > Add Nodes, it distorted the path. Originally the path followed the edge of the dark brown object. I know how to fix that, though.

It's the overlaps/gaps where the path curves, that's got me stumped. Any suggestions?

I appreciate anything you all can offer!
Thanks :D

User avatar
microUgly
Site Admin
Posts: 2985
Joined: Sat Jun 02, 2007 3:13 pm
Contact:

Re: Gradient to Path

Postby microUgly » Thu Jul 03, 2008 7:16 pm

You need to make the spacing between everything much smaller. You also need to not use any transparency to avoid colours building up in the overlapping areas.

User avatar
brynn
Posts: 10309
Joined: Wed Sep 26, 2007 4:34 pm
Location: western USA
Contact:

Re: Gradient to Path

Postby brynn » Thu Jul 03, 2008 8:04 pm

Hhm, well the spacing is already 0.5, but yes, there's room to go shorter. But regarding the transparency, the tutorial says that transparency can be used. So what does it mean, that I'm not getting?

jude
Posts: 37
Joined: Thu Jun 05, 2008 1:08 am

Re: Gradient to Path

Postby jude » Thu Jul 03, 2008 8:15 pm

It looks to me as though the author has used transparency in the images where a horizontal marker has been used, like in the last image in the tutorial. I don't think you'll be able to have transparency without the overlaps being visible.

How would it look if your marker was wedge shaped?

All I can think of is to fake a transparent look with clever colour choices but it's far from ideal.

User avatar
brynn
Posts: 10309
Joined: Wed Sep 26, 2007 4:34 pm
Location: western USA
Contact:

Re: Gradient to Path

Postby brynn » Fri Jul 04, 2008 4:11 pm

Thanks jude.
Well a wedge shape would work on one side of the path, but not on the other.....I wonder if I could divide the path into segments, where I'd use the wedge for curved areas, but for segments with curves in the opposite direction, turn the wedge over.....but I'm not sure I have enough patience for that. Hhhmmm....although, if I do it so that the dark part of the gradient is on the wide end of the wedge, the overlap might not be as obvious (because the base, brown object is so dark). I don't know, but I think the bottom line is that because some curves are sharper than others, making the overlaps and corresponding gaps unequal -- and unless I divide the path into segments, and treat each one separately, there can be no one shape or size for the marker that will work on all the curves.

I'm thinking my best bet is to go opaque, and just try to match the colors very well. Then instead of using it in some layer above the base (opaque)(brown) object, like typical highlights/shading, I'll make it part of the base object.

Well, thanks micro and jude 8-)
I think I'll make the nodes 0.3 spacing, and leave the marker 0.5 wide, and try the opaque thing. Before undoing the marker that I showed in the screen shot, I used the eyedropper tool to obtain the actual colors for the gradient stops. So they'll be pretty darn close, whether this technique is going to work for me or not. And if not, I think I'll try the 3D Edge Effect.

Anyway, I'll let you know how it turns out....cross fingers :mrgreen:

User avatar
brynn
Posts: 10309
Joined: Wed Sep 26, 2007 4:34 pm
Location: western USA
Contact:

Re: Gradient to Path

Postby brynn » Fri Jul 04, 2008 9:38 pm

Here's a fresh screen capture http://img65.imageshack.us/img65/5368/inkgtpss2zp9.png.

I think the opaque thing may work, but I'm stuck trying to get it opaque. You can see that there's still some transparency, however I can't figure out where it's coming from. I've tripled checked all these areas:
-- the object itself, 255 Alpha, 100% Opacity, 0% Blur
-- the gradient used in the object, all stops show 255 Alpha, colorcodes ending in ff
-- the path, 255 Alpha, 100% Opacity, 0% Blur
-- the layer it's in is 100% Opacity, Normal Blending mode
WHAT else could be the source of the transparency? Arrrggh!!

The only thing I can think, is that at the point when I added nodes, the stroke of the path was partially transparent. Because my previous trials indicated that adding nodes was going to distort the path, I made it partially transparent to help with moving the nodes back into place. But I returned it to fully opaque after that. So the Add Nodes Effect, it wouldn't be having some effect on the stroke of the path -- could it?? I didn't want to try Undoing back to that point, because the tweaking of the nodes was a bit tedious, and didn't want to do it again. But again, I returned it to fully opaque afterwards.

Other than that, there are still some gaps to be found in the sharpest curves, but they aren't noticable except at high zoom. So I think that'll be fine. But just in case, I'm thinking I could add a slight Blur, and virtually get rid of thase gaps. (However, I have NOT done any blurring yet -- not the cause of the mysterious transparency). Here's a sample at lower zoom (~600%) http://img68.imageshack.us/img68/2774/inkgtpss3ix3.png

Well, for that matter, the overlaps aren't that noticable either. And at zero zoom....hhhmm, maybe I should leave well enough alone, at this point....except it's going to bug me, just knowing it's not quite right... :roll:

In any case, sorry for being a bit wordy. Thanks for any comments, and I appreciate your help :D
All best.

User avatar
microUgly
Site Admin
Posts: 2985
Joined: Sat Jun 02, 2007 3:13 pm
Contact:

Re: Gradient to Path

Postby microUgly » Sun Jul 06, 2008 3:05 pm

If you can post the SVG we may be able to find the transaparency for you.

Lazur
Posts: 4717
Joined: Tue Jun 14, 2016 10:38 am

Re: Gradient to Path

Postby Lazur » Fri Mar 27, 2015 4:33 am

Resurrecting this one only to post some links how it got evolved:

Fake a Curved Gradient, Using Markers

Bending a chrome rail.

gradient bending with diffuse lighting filter

and maybe also related:
No. 0.91 pencil


Return to “Help with using Inkscape”