Car Animation

Visuals, audio, animation. Blended, not stirred. If LiveCode is part of your rich media production toolbox, this is the forum for you.

Moderators: Klaus, FourthWorld, heatherlaine, robinmiller, kevinmiller

Post Reply
capellan
Posts: 527
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Car Animation

Post by capellan » Thu Sep 06, 2018 5:38 am

Hi All,

Take a look at this car animation. How could we make
car steering more smooth in every kind of track (X,Y,Z)?

Thanks in advance!

Al
Car Animation v01 stack screenshot.JPG
Stack screenshot
Car_Animation_01.zip
Compressed stack
(6.51 KiB) Downloaded 54 times

capellan
Posts: 527
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Car Animation

Post by capellan » Thu Sep 06, 2018 4:24 pm

Check this updated stack with options
to draw a center line on the road and
change road width.

Al
Car Animation v02 stack screenshot.JPG
Stack screenshot
Car_Animation_02.zip
Compressed stack
(6.77 KiB) Downloaded 58 times

sphere
Posts: 706
Joined: Sat Sep 27, 2014 10:32 am
Location: Earth

Re: Car Animation

Post by sphere » Fri Sep 07, 2018 12:07 pm

This looks like fun, i'm gonna try it out. :D :lol:
:D :o :) :shock: 8) :lol:

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 2786
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Car Animation

Post by richmond62 » Fri Sep 07, 2018 6:41 pm

move to the points of grc "XYZ"

The main problem is how to get a "track" with evenly spaced points.

Hand-drawing a multi-point graphic is useless.

sphere
Posts: 706
Joined: Sat Sep 27, 2014 10:32 am
Location: Earth

Re: Car Animation

Post by sphere » Fri Sep 07, 2018 9:01 pm

you need something like bezier-interpolation, some info:https://desktop.arcgis.com/en/arcmap/10 ... olygon.htm

Maybe Herman (-hh) can help with this as he is the expert seeing his fantastic graphical work.

Another nice info: https://bost.ocks.org/mike/simplify/ move your mouse over the image
:D :o :) :shock: 8) :lol:

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 2786
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Car Animation

Post by richmond62 » Fri Sep 07, 2018 9:25 pm

Just to be bloody-minded I started messing around with Turtle blocks:

http://ppa.launchpad.net/alanjas/turtle ... tleblocks/
-
turtleY.png
-
and, as you can see, things were not really that difficult.
-
Traced that shape using Inkscape to make an SVG file

and imported the SVG file as a widget:
-
SVG Importer.livecode.zip
Richmond's SVG chewer
(74.84 KiB) Downloaded 48 times
-
and then got STUCK, as have no idea how to turn an SVG widget into a Polygon Graphic.
-
why.svg.zip
SVG track
(2.05 KiB) Downloaded 46 times

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 2786
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Car Animation

Post by richmond62 » Fri Sep 07, 2018 9:41 pm

Thoughts . . .

http://andregarzia.on-rev.com/alejandro ... t_V05C.zip

Pity it is tied to the proprietary Illustrator format" all "very awkward" when one does not have money for expensive Adobe stuff, especially, given GIMP and INKSCAPE, it seems unnecessary.

Oh, well, "ask no questions, tell no lies" . . .
-
why.ai.zip
(32.5 KiB) Downloaded 47 times
-
Ouch:
-
prob.png

richmond62
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 2786
Joined: Fri Feb 19, 2010 10:17 am
Location: Bulgaria
Contact:

Re: Car Animation

Post by richmond62 » Sat Sep 08, 2018 3:43 pm

It would be VERY USEFUL if one could plot out a polygon graphic's shape
(points) in the way I did using Turtle graphics inwith LiveCode.

Another way of going about things would be if there were some software that could
analyse a shape and extract a point list.
-
why.png
why.png (5.52 KiB) Viewed 615 times

bogs
Posts: 2371
Joined: Sat Feb 25, 2017 10:45 pm

Re: Car Animation

Post by bogs » Sat Sep 08, 2018 4:43 pm

richmond62 wrote:
Sat Sep 08, 2018 3:43 pm
Another way of going about things would be if there were some software that could
analyse a shape and extract a point list.
Well, Inkscape, GIMP, or any other number of programs do that, but, you *could* use the plugin ClipArtGuy wrote in the newer versions of Lc and that gives you a great point list setup. I really should experiment and see if it could be transported backwards. Hmmmmm :roll:
Image

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 1808
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Car Animation

Post by [-hh] » Sat Sep 08, 2018 5:07 pm

Here one way to draw your graphic with as few points as needed using LC 6/7/8/9:

[1] Draw a graphic with the graphics curve tool.
[2] Simplify the points (raspi-stacks-collection #103).
     http://forums.livecode.com/viewtopic.ph ... 49#p157049
[3] Fine-tune the points manually.
     set selectionHandleColor to "cyan" (so that you can see the handles)
     ON: set editmode of grc RM to "polygon"
     OFF: set editmode of grc RM to "none"

The simplify-algorithm yields few points on straight way parts and more points on curved way parts so that the car moves faster along the few points and slower going through the bends.
shiftLock happens

bogs
Posts: 2371
Joined: Sat Feb 25, 2017 10:45 pm

Re: Car Animation

Post by bogs » Sat Sep 08, 2018 7:19 pm

That is pretty awesome -hh!
Image

capellan
Posts: 527
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Car Animation

Post by capellan » Sun Sep 09, 2018 6:30 am

Many, many thanks to all!

After asking a Highway engineer, I learned many great
things about roads and their design.

Looks like every round corner requires a different number
of points with different spacing between them, just to
produce the visual illusion of a smooth steering.

Hermann stack is really useful to demonstrate this.

If we replace the Car with a completely circular figure,
like the Pacman, an umbrella or a Round Table then
a smooth steering effect is achieved automatically.
Check the attached stack. Click the animated gif.

So there is no general solution, but an optimal design
for each unique road figure.

Al
Car_Animation_03.zip
Compressed stack
(7.41 KiB) Downloaded 54 times

capellan
Posts: 527
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Car Animation

Post by capellan » Mon Sep 10, 2018 2:03 am

By the way, the Adobe Ilustrator file posted by Richmond,
it´s a pdf file (version 1.5)

The stack "EPS Import v05C" only could import
Adobe Ilustrator files saved as version 5, 6 or 7.

Xara is my current Design software.

Al

capellan
Posts: 527
Joined: Wed Aug 15, 2007 11:09 pm
Contact:

Re: Car Animation

Post by capellan » Mon Sep 10, 2018 11:44 pm

I was wrong. It's possible to create a General Solution.
We just have to find data that is meaningful.
Take a look at this log data.

Numbers 1 to 4 are two coordinates.
The most important is the last number.
That is the image angle.

Could you find a pattern in
the image angle?

Code: Select all

371,360,368,363,135
368,363,367,366,108.434949
367,366,365,370,116.565051
365,370,364,373,108.434949
364,373,363,377,104.036243
363,377,363,380,90
363,380,363,384,90
363,384,363,387,90
363,387,363,391,90
363,391,363,394,90
363,394,364,398,75.963757
364,398,365,401,71.565051
365,401,366,404,71.565051
366,404,367,407,71.565051
367,407,369,411,63.434949
369,411,371,414,56.309932
371,414,372,416,63.434949
372,416,375,419,45
375,419,377,422,56.309932
377,422,379,424,45
379,424,382,426,33.690068
382,426,385,428,33.690068
385,428,388,430,33.690068
388,430,391,432,33.690068
391,432,394,433,18.434949
394,433,398,434,14.036243
398,434,401,435,18.434949
401,435,405,436,14.036243
405,436,409,436,0
409,436,413,437,14.036243
413,437,420,437,0
420,437,421,436,-45
421,436,423,436,0
423,436,425,436,0
425,436,426,436,0
426,436,428,436,0
428,436,430,435,-26.565051
430,435,431,435,0
431,435,433,435,0
433,435,435,434,-26.565051
435,434,436,434,0
436,434,438,433,-26.565051
438,433,439,432,-45
439,432,441,432,0
441,432,442,431,-45
442,431,444,430,-26.565051
444,430,445,429,-45
445,429,447,428,-26.565051
447,428,448,427,-45
448,427,450,426,-26.565051
450,426,451,425,-45
451,425,452,424,-45
452,424,453,423,-45
453,423,455,422,-26.565051
455,422,456,421,-45
456,421,457,419,-63.434949
457,419,458,418,-45
458,418,459,417,-45
459,417,460,415,-63.434949
460,415,461,414,-45
461,414,462,413,-45
462,413,480,384,-58.172553
480,384,482,381,-56.309932
482,381,484,378,-56.309932
484,378,486,375,-56.309932
486,375,489,373,-33.690068
489,373,491,371,-45
491,371,494,369,-33.690068
494,369,497,367,-33.690068
497,367,500,365,-33.690068
500,365,503,364,-18.434949
503,364,506,363,-18.434949
506,363,509,362,-18.434949
509,362,513,361,-14.036243
513,361,516,360,-18.434949
516,360,519,360,0
519,360,522,360,0
522,360,526,360,0
526,360,529,360,0
529,360,532,361,18.434949
532,361,535,362,18.434949
535,362,539,363,14.036243
539,363,542,364,18.434949
542,364,545,365,18.434949
545,365,548,367,33.690068
548,367,551,369,33.690068
551,369,553,371,45
553,371,556,373,33.690068
556,373,558,376,56.309932
558,376,561,378,33.690068
561,378,563,381,56.309932
563,381,565,384,56.309932
565,384,582,413,59.620874
582,413,583,414,45
583,414,584,415,45
584,415,585,417,63.434949
585,417,586,418,45
586,418,587,419,45
587,419,588,421,63.434949
588,421,589,422,45
589,422,591,423,26.565051
591,423,592,424,45
592,424,593,425,45
593,425,594,426,45
594,426,596,427,26.565051
596,427,597,428,45
597,428,599,429,26.565051
599,429,600,430,45
600,430,602,431,26.565051
602,431,603,432,45
603,432,605,432,0
605,432,606,433,45
606,433,608,434,26.565051
608,434,609,434,0
609,434,611,435,26.565051
611,435,613,435,0
613,435,614,435,0
614,435,616,436,26.565051
616,436,618,436,0
618,436,620,436,0
620,436,621,436,0
621,436,623,436,0
623,436,625,437,26.565051
625,437,636,437,0
636,437,640,436,-14.036243
640,436,643,436,0
643,436,647,435,-14.036243
647,435,651,434,-14.036243
651,434,654,433,-18.434949
654,433,657,432,-18.434949
657,432,661,430,-26.565051
661,430,664,428,-33.690068
664,428,666,426,-45
666,426,669,424,-33.690068
669,424,672,421,-45
672,421,674,419,-45
674,419,676,416,-56.309932
676,416,678,413,-56.309932
678,413,680,410,-56.309932
680,410,681,407,-71.565051
681,407,683,404,-56.309932
683,404,684,401,-71.565051
684,401,685,397,-75.963757
685,397,685,394,-90
685,394,686,390,-75.963757
686,390,686,387,-90
686,387,686,383,-90
686,383,685,380,-108.434949
685,380,685,376,-90
685,376,684,373,-108.434949
684,373,683,369,-104.036243
683,369,681,366,-123.690068
681,366,680,362,-104.036243
680,362,678,359,-123.690068
678,359,620,271,-123.388514
620,271,618,269,-135
618,269,617,267,-116.565051
617,267,616,266,-135
616,266,616,264,-90
616,264,615,262,-116.565051
615,262,614,260,-116.565051
614,260,614,258,-90
614,258,613,257,-135
613,257,612,255,-116.565051
612,255,612,253,-90
612,253,612,251,-90
612,251,611,249,-116.565051
611,249,611,247,-90
611,247,611,245,-90
611,245,611,243,-90
611,243,611,242,-90
611,242,611,240,-90
611,240,611,238,-90
611,238,612,236,-63.434949
612,236,612,234,-90
612,234,612,232,-90
612,232,613,230,-63.434949
613,230,613,228,-90
613,228,614,227,-45
614,227,615,225,-63.434949
615,225,615,223,-90
615,223,616,221,-63.434949
616,221,617,220,-45
617,220,618,218,-63.434949
618,218,619,216,-63.434949
619,216,671,137,-56.645974
671,137,672,133,-75.963757
672,133,674,130,-56.309932
674,130,675,126,-75.963757
675,126,676,123,-71.565051
676,123,677,119,-75.963757
677,119,678,116,-71.565051
678,116,678,112,-90
678,112,678,109,-90
678,109,678,105,-90
678,105,677,102,-108.434949
677,102,677,98,-90
677,98,676,95,-108.434949
676,95,675,92,-108.434949
675,92,673,89,-123.690068
673,89,672,86,-108.434949
672,86,670,83,-123.690068
670,83,668,80,-123.690068
668,80,666,77,-123.690068
666,77,664,74,-123.690068
664,74,661,72,-146.309932
661,72,659,70,-135
659,70,656,68,-146.309932
656,68,653,66,-146.309932
653,66,650,64,-146.309932
650,64,646,63,-165.963757
646,63,643,62,-161.565051
643,62,639,61,-165.963757
639,61,636,60,-161.565051
636,60,632,60,180
632,60,628,60,180
628,60,622,60,180
622,60,619,60,180
619,60,618,60,180
618,60,616,60,180
616,60,614,60,180
614,60,612,60,180
612,60,611,61,135
611,61,609,61,180
609,61,607,61,180
607,61,606,62,135
606,62,604,63,153.434949
604,63,602,63,180
602,63,601,64,135
601,64,599,65,153.434949
599,65,598,65,180
598,65,596,66,153.434949
596,66,595,67,135
595,67,593,68,153.434949
593,68,592,69,135
592,69,591,70,135
591,70,589,71,153.434949
589,71,588,72,135
588,72,587,73,135
587,73,585,75,135
585,75,584,76,135
584,76,583,77,135
583,77,582,78,135
582,78,581,80,116.565051
581,80,580,81,135
580,81,579,83,116.565051
579,83,578,84,135
578,84,571,99,115.016893
571,99,568,101,146.309932
568,101,566,104,123.690068
566,104,563,107,135
563,107,561,110,123.690068
561,110,558,112,146.309932
558,112,555,114,146.309932
555,114,552,116,146.309932
552,116,549,117,161.565051
549,117,546,119,146.309932
546,119,543,120,161.565051
543,120,540,121,161.565051
540,121,537,122,161.565051
537,122,533,122,180
533,122,530,123,161.565051
530,123,527,123,180
527,123,523,123,180
523,123,520,122,-161.565051
520,122,517,122,180
517,122,513,121,-165.963757
513,121,510,120,-161.565051
510,120,507,119,-161.565051
507,119,504,117,-146.309932
504,117,501,116,-161.565051
501,116,498,114,-146.309932
498,114,495,112,-146.309932
495,112,493,109,-123.690068
493,109,490,107,-146.309932
490,107,488,104,-123.690068
488,104,485,101,-135
485,101,483,98,-123.690068
483,98,476,85,-118.300756
476,85,475,83,-116.565051
475,83,474,82,-135
474,82,473,80,-116.565051
473,80,472,79,-135
472,79,471,77,-116.565051
471,77,470,76,-135
470,76,469,75,-135
469,75,467,73,-135
467,73,466,72,-135
466,72,465,71,-135
465,71,463,70,-153.434949
463,70,462,69,-135
462,69,461,68,-135
461,68,459,67,-153.434949
459,67,458,66,-135
458,66,456,65,-153.434949
456,65,455,65,180
455,65,453,64,-153.434949
453,64,451,63,-153.434949
451,63,450,63,180
450,63,448,62,-153.434949
448,62,446,61,-153.434949
446,61,445,61,180
445,61,443,61,180
443,61,441,60,-153.434949
441,60,440,60,180
440,60,438,60,180
438,60,436,60,180
436,60,434,60,180
434,60,433,60,180
433,60,423,60,180
423,60,418,60,180
418,60,415,60,180
415,60,411,61,165.963757
411,61,407,62,165.963757
407,62,404,63,161.565051
404,63,401,64,161.565051
401,64,397,66,153.434949
397,66,394,68,146.309932
394,68,392,70,135
392,70,389,72,146.309932
389,72,386,75,135
386,75,384,77,135
384,77,382,80,123.690068
382,80,380,83,123.690068
380,83,378,86,123.690068
378,86,377,89,108.434949
377,89,375,92,123.690068
375,92,374,95,108.434949
374,95,373,99,104.036243
373,99,373,102,90
373,102,372,106,104.036243
372,106,372,109,90
372,109,372,113,90
372,113,373,116,71.565051
373,116,373,120,90
373,120,374,123,71.565051
374,123,375,127,75.963757
375,127,377,130,56.309932
377,130,379,134,63.434949
379,134,381,137,56.309932
381,137,430,212,56.842076
430,212,431,213,45
431,213,432,215,63.434949
432,215,433,217,63.434949
433,217,433,218,90
433,218,434,220,63.434949
434,220,435,222,63.434949
435,222,436,224,63.434949
436,224,436,225,90
436,225,437,227,63.434949
437,227,437,229,90
437,229,437,231,90
437,231,438,233,63.434949
438,233,438,235,90
438,235,438,237,90
438,237,438,239,90
438,239,438,240,90
438,240,438,242,90
438,242,438,244,90
438,244,437,246,116.565051
437,246,437,248,90
437,248,437,250,90
437,250,436,252,116.565051
436,252,436,254,90
436,254,435,255,135
435,255,435,257,90
435,257,434,259,116.565051
434,259,433,261,116.565051
433,261,432,262,135
432,262,431,264,116.565051
431,264,430,266,116.565051
430,266,371,360,122.114831
If my guess is correct, 1 or 2 lines of code
(and 2 or 3 functions) solve this problem. :D

Al

Post Reply

Return to “Rich Media”