In a fit of productivity, I spent yesterday evening developing theAfrica map learning tool (you’ll need the Macromedia Flash Plug-in to view it) that I started so many months ago.
The map started because I am sorely ignorant in the area of geography and wanted to fix that. What better solution than to make a game of it? Producing the map in Flash would also serve the goal of helping me learn Flash programming while I learned the countries of Africa.
This first iteration has all the basic functionality in place. The list of country labels auto-generates from an external file. The mouseover and drag-and-drop effects seem to work as planned. There is still some functionality I have to add as well as some details I need to clean up. Eventually, I’ll add a timer and counter. I’ll have to find a way to fit all the country names on the page. I also want to make the interface clearer so that it’s not so hard to identify some of the smaller countries. But I feel pretty good that it’s gotten as far as it has. It shows that I’m making progress in my Flash education.
While I’ve found the tutorials on kirupa.com to be immensely useful in my Flash education, (today I was learning how to generate 3D shapes from pages like kirupa.com - Solid Pyramids) it should be noted that the example scripts on the pages contain several errors.
This came to light as I was cutting and pasting scripts for adaptation into my own files. Small errors like mis-referencing variables and properties make the learning process much more interactive. Erroneous examples aside, I’ve been able to adapt the basic ideas from the tutorial for my purposes. With any luck I’ll have a working example by the end of the day.
I’m making progress learning how to script in Flash. Today’s assignment was solved in large part thanks to this article, kirupa.com - Dynamic Event Handlers with Flash MX which explained how I could enable different actions on the same object.
This comes in helpful if an object has different functions that it can do depending on its context. I’d try to explain it better but I don’t understand the vocabulary very well yet. Suffice it to say that this is a huge step. My hope is to build an interface inspired by this one, built entirely in Flash. The functionality is almost there. The next step will be adding some of the cool animation on top of the interface and then importing the content.
I suspected that there was an easier equation for movement within a circle and I finally found it here, kirupa.com - Trigonometry included in a nice tutorial. The key is using the radian measurement along with the trigonometric functions, sine and cosine. As explained, the standard equations to determine x and y positions are:
clip._x = originx + Math.cos(angle)*radius;
and
clip._y = originy + Math.sin(angle)*radius;
.
As I determined before, the radius is half of the difference between starting and ending x-value.
Here’s the demo that it took me way too long to put together:
I discovered an error in an arc calculations that I was working on. It caused my test object to always gravitate to a fixed arc path on the stage despite any initial values I’d insert. It turns out that the problem was in calculating the y-coordinate value. Going off the standard equation describing a circle (x-h)2 + (y-k)2 = r2 - I had calculated the formula to solve for y (given only a starting x-value (xFirst) and an ending x-value (xLast) as:
y = square root of (((xLast-xFirst)/2)2 - (x -(xFirst+((xLast-xFirst)/2)))2)
This is correct except that it neglects any initial y-value greater than 0. If the arc is to be displaced off the baseline you have to add the original y-displacement to the answer;
y = square root of (((xLast-xFirst)/2)2 - (x -(xFirst+((xLast-xFirst)/2)))2) + yFirst
It is also important to note that in Flash the grid isn’t a standard Cartesian numbered grid. The origin is in the top left and increases values both down and to the right. Which means you need to multiply by -1 to get things arcing in the “proper” orientation.
I’m getting a little better working with Flash. It helps to have something to build off of.
This latest map incorporates Actionscript and XML to create an easily updatable navigation element for one of my company’s web pages. To update the map (to add or remove links), all I have to do is modify the associated XML file and the Flash will automatically reflect any changes. No need to revise the Flash file at all.
This project required a couple of new elements from previous maps I’ve generated. The XML import is the same as in previous file but I had to add an additional URL attribute to each XML node so that I could create the link to the appropriate web page. This required some instruction on How to create multidimensional arrays in Flash. I also needed to figure out the syntax for how to check for an empty attribute for which this article, If statement fails when evaluating undeclared variables came in handy.
All in all the map works exactly how I want it to. It’s not very flashy but it is functional. I’ll work on flashy tomorrow.