Classic Motion Guide does not work as expected

[Bobby Jourdan]

Hi there,

I am using a Classic Motion Guide in HTML 5 Canvas project but I have encountered a problem.

Please have a look at the image. When I test it in Animate CC with Enter it all looks good.

When I test it in browser or publish, the plane goes straight from point A to point B.

Thanks for your help

B

[Colin Holgate]

I tried a test of that, and it seems to work for me. You could use the developer tools in the browser to see if there are any errors. Or, if you have somewhere you could post your FLA, and give us the link, we could look for what is wrong.

[Bobby Jourdan]

Hi Colin

Thanks for that. Which tab should I use from the Developer tools

Is it when I test in Browser or I should publish it on a network?

Thanks

B

[Colin Holgate]

Just do a Control/Test Movie/In Browser from Animate, then show the browser's Console/Errors.

The first part of this article shows how to get the developer tools in different browsers, though I think you got that far already:

How to access the developer tools in your web browser and collect a 'HAR' file for escalation - Soph...

You're just looking for any errors that show up. If there's one about favicon, that's ok. If there are other errors it might give us some clues.

[Bobby Jourdan]

Thanks, I am using normally the developer tools when I publish my project in Captivate and did exactly what you said. I am posting here an image with explanations. At the top you can see the preview in browser. Under you can see how it behaves in the Animate ...

[chenjil43641795]

Guide Line cannot Cross.

To do the crossover, you need to divide into 2 paragraphs.

[Bobby Jourdan]

Thanks for that.

I thought it is possible. I was watching this video https://youtu.be/_WsvcLqPNWg?t=20m18s

If you follow the part with the guide (I linked exactly to that part) you will see that the guy does not use two layers. Strange ...

[chenjil43641795]

I've seen it.

His animation is divided into 3 parts.

Although on the 1 Level.

Stop booting to intersecting segments and start line-by-row adjustments.

And I do the same thing in 2 parts.

But it's a bit of a hassle, because when you're circling, each screen adjusts to rotate.

I do that you just have to select,--Sync along the path.

The meaning is the same.

If you make it according to the video.

Then you need to insert keyframes before the intersection.

Then manually insert more keyframes.

Let the plane circle around.

After crossing the point,

and continue to guide you along.

[chenjil43641795]

If you don't want to do 2 segments,

You can also use the Create tween.

Use the white arrows to adjust.

ALT + White Arrow Adjust arc

[Bobby Jourdan]

Actually I tried a simple curve to test.

I have exactly the same issue. So I am missing here something fundamental

Look at the image. The dotted curve is the guide and it works well if I test in the Animate

If I test in browser the plane follows a trajectory similar to the green curve!

I also adjusted the tween with the White Arrow Subselection tool but the plane just does not follow the curve at all.

I am doing something wrong

[chenjil43641795]

The guide line is not visible.

The dotted line is visible.

You need to make the wire and the dotted line the same.

The center point of the movie clip is the alignment conductor.

You can turn on the adsorption(Snap to Object)

Don't speak English well, apologize first.

I don't know if you can understand.

[Bobby Jourdan]

No worries about the English, I appreciate your help

I have turned on the Snap To Object

Also, there are two curves - one is the visible one and the other is the guide. Both have the same trajectory. Just that the plane does not follow that trajectory when previewed in browser ...

[chenjil43641795]

Press ENTER in the software to preview.

Whether it is also an error

[Bobby Jourdan]

When previewing with Enter it behaves ok, the tween is correct

Only when I preview in browser do I have this issue ...

Super strange

[chenjil43641795]

I think I might need to see your source file fla.

[chenjil43641795]

Can you find a place to upload, I'll check for you.

Google's disk or OneDrive

[Bobby Jourdan]

there u go

https://we.tl/R6hEzwjk2U

[chenjil43641795]

2 questions.

1,Do not use dashed lines as guide line

2,HTML5 load slow, at the beginning, the position is not at the front of the line, slightly moved to the back point.

The first frame will jump.

[Colin Holgate · Accepted solution]

Lines that loop, like in your original and in my test, do work fine. But dotted lines don't. Either redraw the lines as a solid line, or change the line style to solid, and you would also need to delete any left of blobs from the dotted version. Then it will work.

Animate, and SWFs, know that a dotted line is a regular line that looks dotted. CreateJS doesn't know that, so the line gets converted to a lot of short vectors, and the guide breaks. At least that's my guess! Old tutorial videos on how to use guides may have used dotted lines without running into problems, if they were for SWF.

[Bobby Jourdan]

Thanks, this solved the problem