It is my understanding that layers will be drawn in the order that they are stacked. Top being drawn last. The top layer is not drawn last. Why is that?
The timeline at the bottom on the canvas/editing area represents the order in which each item is drawn.
You will find the order follows the timeline which also means that if you were layering items on top of each other, the bottom layer would be the first item in the timeline.
Thanks, Joe
M
Mike Metcalf
On
Wed, 11 Jun, 2014 at 6:44 PM
Hi Don,
If I understand correctly, you are referring to a particular SVG and not the elements in a scribe.
THE PROBLEM: Any time you nest groups (or layers) within other groups (or layers) you change the drawing order. that is why the bumper sticker is drawn before the rest of the car.
From what I can see, your SVG is drawing in the "correct" order based on the layer groups you created. (except for the bottom layer group which you have hidden so it will not be shown .) Videoscribe starts with the bottom group, draws only the paths in the four main groups and then it goes back and draws the paths in the nested groups WITHIN those groups from bottom to top and so on
THE SOLUTION: select and drag all of the paths in each subgroup into their parent group
on a separate note:
Your SVG is 386 kb which is pretty oversized for an SVG of this level of detail. and indicates that your SVG may not have been made or saved in a way that is best suited for videoscribe. using multiple SVGs that "contain extra or undesirable data" may eventually cause a slowdown or crash.
Recommended settings for saving an SVG in illustrator:
EDIT:Regarding Embed or Link: If you happen to have a jpg or png or other images in your SVG, selecting "Embed" will include them in the saved SVG, which can be a useful, simple way to incorporate a photo or shaded illustration with your own vector line art. (However, be aware that embedding images increases file size and might possibly contribute to slowdowns or freezes, so you may want to use it sparingly or at least only embed images with smaller file sizes. ). Selecting "Link" instead of "embed" will essentially kick out any inserted images and save them as separate files which will make your SVG smaller, but videoscribe will not display linked images. My suggestion based on personal experience is to use only paths, strokes and fills in your SVG and to delete any extra images. That way it won't matter if you choose embed or link because there will be nothing to embed or link.(just my opinion- I'm just a user)
-Mike (videoscribe user)
P
Page Publique
On
Thu, 9 Oct, 2014 at 9:49 AM
Hi Mike,
I downloaded the svg and can't achieve to make the sticker draw last (I already had that problem before, so I try to understand how to fix it).
What do you mean by "select and drag all of the paths in each subgroup into their parent group" ?
M
Mike Metcalf
On
Thu, 9 Oct, 2014 at 5:10 PM
Hi Page,
(note: You may be able to see the layers and paths in illustrator but if you use inkscape I'm not sure if they will be displayed the same way.)
Here is an image showing (in illustrator) paths in nested layers on the left and stroked paths that have all been moved into a single layer on the right. The red numbers indicate the order in which videoscribe will draw stroked paths based on the nesting. Notice that if you only have one layer containing all of the paths (as shown in the image on the right), they are drawn very simply from the bottom to the top of the list. With nested layers, the order becomes more complicated starting with the leftmost paths being drawn from bottom to top, followed by the next deeper set of nested paths from bottom to top and so on. ( you can use "right-click > view image" or ctrl+ mouse wheel to view the attachment larger):
It's perfectly okay to use some nested layers in my opinion, but if you are running into trouble with the drawing order, it may be easier to just use one layer full of paths (or multiple layers with no nested layers within them).
If you use Inkscape instead of Illustrator, you may not be able to view the layer arrangement in the same way as you can in illustrator, I THINK if you manually select all of the paths with the lasso tool (don't use ctrl+a to select all) and then cut and paste, that will put all of the paths in one layer. Then you can manually select just the paths that you want to draw last and cut and paste them, and that should put them last in the drawing order. I don't currently have Inkscape on this computer so I can't test that theory.
-Mike (videoscribe user)
P
Page Publique
On
Fri, 10 Oct, 2014 at 12:47 PM
Thank you very much Mike, very useful post.
Thanks fo your big help on this forum.
R
Ray Craighead
On
Thu, 30 Jul, 2015 at 9:59 PM
I've been struggling with "drawing order" as well and have stumble onto the problem: I routinely use Illustrator effects to change the appearance of a line. If a line has an "effect" assigned to it VideoScribe throws it to the top of the drawing list, regardless of its location in the layer list. Is this discussed anywhere in the forum? I haven't been able to find it. Workarounds are to delete the effect or "expand" it.
M
Mike Metcalf
On
Thu, 30 Jul, 2015 at 10:45 PM
effects, styles, masks, etc may produce unexpected or undesired results.
stroked paths and filled paths work best. If you are experiencing any problems it may be best to convert everything to stroked paths and/or filled paths with no effects styles or masks.
-Mike (videoscribe user)
Y
Yvonne de Hont
On
Wed, 26 Apr, 2017 at 10:59 AM
I know that layers will be drawn in the order that they are stacked. But sometimes I rearrange the way they are stacked because I prefer a different kind of order or had to add something. But then the svg no longer draws in the right order as the strokes are stacked...? How can I solve this?
M
Mike Metcalf
On
Wed, 26 Apr, 2017 at 1:57 PM
Hi, If you don't understand a specific SVG, you could attach it here and describe what part seems out of order.
-Mike (videoscribe user)
Y
Yvonne de Hont
On
Wed, 26 Apr, 2017 at 2:09 PM
As said, I rearrange the order of the strokes in illustrator. They are in the right order in the file, but somehow it is drawn in a different, weird order. For example, this little circles are at the top of the stack and should be drawn at last...
It seems that whenever I change the order of the strokes after I have draw them, the svg is not working in the right order.
That makes it difficult, because it means I can never change anything after I have drawn all strokes..
Those circles are being drawn twice because they are in your "colors" group (which is being drawn first) as well as your "strokes" group.
If you hide the "strokes" group and look at what is still visible, you will notice that some of your color paths have black strokes. Videoscribe is drawing those stroked paths first (including the circles you mentioned). Next, videoscribe is drawing all of the stroked paths in your "strokes" group, including drawing the same circles again.
A simple solution is to select everything in the "colors" group and then remove the strokes (leaving just the color fills), then resave the SVG and import the new version into videoscribe.
-Mike (videoscribe user)
Y
Yvonne de Hont
On
Wed, 26 Apr, 2017 at 3:26 PM
Hi, thanks. Did not noticed that. Usually I set the stroke on 0 px when making the fill color, but apparently missed that with some. It was driving me crazy I could not figure out why it did not work properly.
Hi Don,
The timeline at the bottom on the canvas/editing area represents the order in which each item is drawn.
You will find the order follows the timeline which also means that if you were layering items on top of each other, the bottom layer would be the first item in the timeline.
Thanks, Joe
Hi Don,
If I understand correctly, you are referring to a particular SVG and not the elements in a scribe.
THE PROBLEM: Any time you nest groups (or layers) within other groups (or layers) you change the drawing order. that is why the bumper sticker is drawn before the rest of the car.
From what I can see, your SVG is drawing in the "correct" order based on the layer groups you created. (except for the bottom layer group which you have hidden so it will not be shown .) Videoscribe starts with the bottom group, draws only the paths in the four main groups and then it goes back and draws the paths in the nested groups WITHIN those groups from bottom to top and so on
THE SOLUTION: select and drag all of the paths in each subgroup into their parent group
on a separate note:
Your SVG is 386 kb which is pretty oversized for an SVG of this level of detail. and indicates that your SVG may not have been made or saved in a way that is best suited for videoscribe. using multiple SVGs that "contain extra or undesirable data" may eventually cause a slowdown or crash.
Recommended settings for saving an SVG in illustrator:
EDIT: Regarding Embed or Link: If you happen to have a jpg or png or other images in your SVG, selecting "Embed" will include them in the saved SVG, which can be a useful, simple way to incorporate a photo or shaded illustration with your own vector line art. (However, be aware that embedding images increases file size and might possibly contribute to slowdowns or freezes, so you may want to use it sparingly or at least only embed images with smaller file sizes. ). Selecting "Link" instead of "embed" will essentially kick out any inserted images and save them as separate files which will make your SVG smaller, but videoscribe will not display linked images. My suggestion based on personal experience is to use only paths, strokes and fills in your SVG and to delete any extra images. That way it won't matter if you choose embed or link because there will be nothing to embed or link. (just my opinion- I'm just a user)
-Mike (videoscribe user)
Hi Mike,
I downloaded the svg and can't achieve to make the sticker draw last (I already had that problem before, so I try to understand how to fix it).
What do you mean by "select and drag all of the paths in each subgroup into their parent group" ?
Hi Page,
(note: You may be able to see the layers and paths in illustrator but if you use inkscape I'm not sure if they will be displayed the same way.)
Here is an image showing (in illustrator) paths in nested layers on the left and stroked paths that have all been moved into a single layer on the right. The red numbers indicate the order in which videoscribe will draw stroked paths based on the nesting. Notice that if you only have one layer containing all of the paths (as shown in the image on the right), they are drawn very simply from the bottom to the top of the list. With nested layers, the order becomes more complicated starting with the leftmost paths being drawn from bottom to top, followed by the next deeper set of nested paths from bottom to top and so on. ( you can use "right-click > view image" or ctrl+ mouse wheel to view the attachment larger):
It's perfectly okay to use some nested layers in my opinion, but if you are running into trouble with the drawing order, it may be easier to just use one layer full of paths (or multiple layers with no nested layers within them).
If you use Inkscape instead of Illustrator, you may not be able to view the layer arrangement in the same way as you can in illustrator, I THINK if you manually select all of the paths with the lasso tool (don't use ctrl+a to select all) and then cut and paste, that will put all of the paths in one layer. Then you can manually select just the paths that you want to draw last and cut and paste them, and that should put them last in the drawing order. I don't currently have Inkscape on this computer so I can't test that theory.
-Mike (videoscribe user)
Thank you very much Mike, very useful post.
Thanks fo your big help on this forum.
I've been struggling with "drawing order" as well and have stumble onto the problem: I routinely use Illustrator effects to change the appearance of a line. If a line has an "effect" assigned to it VideoScribe throws it to the top of the drawing list, regardless of its location in the layer list. Is this discussed anywhere in the forum? I haven't been able to find it. Workarounds are to delete the effect or "expand" it.
stroked paths and filled paths work best. If you are experiencing any problems it may be best to convert everything to stroked paths and/or filled paths with no effects styles or masks.
-Mike (videoscribe user)
I know that layers will be drawn in the order that they are stacked. But sometimes I rearrange the way they are stacked because I prefer a different kind of order or had to add something. But then the svg no longer draws in the right order as the strokes are stacked...? How can I solve this?
If you don't understand a specific SVG, you could attach it here and describe what part seems out of order.
-Mike (videoscribe user)
As said, I rearrange the order of the strokes in illustrator. They are in the right order in the file, but somehow it is drawn in a different, weird order. For example, this little circles are at the top of the stack and should be drawn at last...
It seems that whenever I change the order of the strokes after I have draw them, the svg is not working in the right order.
That makes it difficult, because it means I can never change anything after I have drawn all strokes..
(I use Illustrator CC).
Those circles are being drawn twice because they are in your "colors" group (which is being drawn first) as well as your "strokes" group.
If you hide the "strokes" group and look at what is still visible, you will notice that some of your color paths have black strokes. Videoscribe is drawing those stroked paths first (including the circles you mentioned). Next, videoscribe is drawing all of the stroked paths in your "strokes" group, including drawing the same circles again.
A simple solution is to select everything in the "colors" group and then remove the strokes (leaving just the color fills), then resave the SVG and import the new version into videoscribe.
-Mike (videoscribe user)
Hi, thanks. Did not noticed that. Usually I set the stroke on 0 px when making the fill color, but apparently missed that with some. It was driving me crazy I could not figure out why it did not work properly.
Thanks for the quick replies!
Have a nice day.
kind regards,
Yvonne