10 Nov 2010 2:57 AM #1
Animated 3D Compass
We need to generate a static compass with a moving needle. the compass is in 3d. will i have any luck letting one of my coders do that in html5 and should he use the animator for such a task. i don't want to sound ignorant at all i just don't know enough to make the correct decision.
thanks for help
design sketch of compass: http://img.skitch.com/20101110-jc8c5...np.preview.jpg
11 Nov 2010 6:54 AM #2
Moving the needle around like this is a 3D animation that is currently only supported on iphone/iPad (and really, not that well). You can create this animation in Animator, but it won't preview correctly in the stage. If you're ok with both those things then you can do this by:
Creating a base object image with just the compass as you show it (no needle)
Creating a container to hold the image of a needle with no perspective (aka it should be a photo graph of it taken from directly above.
Rotate the needle in X until it matches the angle of the compass in your image
Add an animation that rotates the needle in Z to show it spinning.
11 Nov 2010 12:16 PM #3
With that, the 3d animation is not anti-aliased, thus will look chunky and blocky, much like the SNES Mode-7:
Actual in -work example:
16 Nov 2010 5:55 AM #4
I made "quick and dirty" 3d compass using just Sencha Animator. I removed pointer/indicator in Photoshop and made new undistorted one. It took me 10 mins. so it isn't perfect, but gives you idea.
Sorry for crapy host.
By SimonFlack in forum Sencha Touch 1.x: DiscussionReplies: 11Last Post: 7 Jan 2011, 2:08 PM
By emroot in forum Sencha Touch 1.x: DiscussionReplies: 0Last Post: 8 Oct 2010, 7:53 AM
By willi in forum Sencha Touch 1.x: DiscussionReplies: 3Last Post: 9 Sep 2010, 2:06 AM
By neall in forum Ext 2.x: Help & DiscussionReplies: 36Last Post: 20 May 2009, 11:21 AM
By magicfrog in forum Ext 1.x: Help & DiscussionReplies: 3Last Post: 5 Jul 2007, 3:56 AM