Cooordinate Calculation

instead of creating multiple different functions for each situation i decided to create a single function that could be adapted using the constants to buld chains or branches.

The most elegant way of doing this that cam eot mind was using trigonometry.

x = r*cos(theta);
y = r*sin(theta);

Given a radius r and angle theta you can calcuate the x and y coordiantes of a point.

multiple braches can be created around a point using different values for "theta".




Chains of nodes can be calcuaated using a const value for theta and making the coordinates cumulative.



So using actionscript we can gernalize this to create a coordiante calcuator that uses a set of constants to calcuate the node position based on its ID number.

code..

Each node position is calcuated from a series of cumulative steps. A step value is calcuated for x and y and then added to a running total for each number cluster in a node id. once all the number clusters a node id has been cycled through the final total is returned which gives the resulting x and y coordinates for that node ID, this is then stored in a corrdinate array.

This process continues until each node ID has a X and Y coordinate.

Constants Array

One of the things that must be known in oder to position a branch node correctly is the total number of branches around its "parent" node.

Writing this infomration explicitly into the ID number would have made the xml list incredibly difficult to edit as each time you add a node to the list you would have to update the ID numbers of a large number of other nodes as the totals would be different.

To over come this problem i decided to create a counting algorithm that when given a node ID number:
1. seaches through all the nodes on the list to find nodes of the same group,
2. calcuated the total number of braches "bt".
3. returns that value to all the nodes in the group.

This is then done for the chain total "ct" , child total "cdt".

The resulting array contains a series of constants for each number cluster in a node id: b,bt,b,ct,cd,cdt.




This is done for each number cluster in each node ID.

.

This array of constants must be produced for each node ID in the XML file.

Armed with all the required data about each node the next step was to create a function that can calculate an x and y coordinate for each ID number.

Using XML Lists

Why Choose Flash?
I have decided on using Adobe Flash as my medium of choice in which toi develop the mapping software. In my experience as a webdesigner and animator I have found that flash has not only become the medium of choice online for interactive, rich multimedia content but it does not over tax the CPU or RAM of a users when processing dynamic content. In addition the vector based animation script will allow me to efficiely maniplate the node points in 2D and 3D and control text, images and streaming video dynamically.

The initial design of the map will show summaries of data located at the node points such as a title, short description and a thumbnail image. The user can then double click on these "snippets" of info to access the full infomation set. The information set can be a text, images, animation, audio or video. In order to deal with the problem of loading bottle necks across the web the full multimedia content associsated with each node will only be loaded "on request". This will enable fast download times and a uninterrupted user experience even with slow internet connections and low spec computers. Flash is well suited to the task of juggling these demands and currently presents the most elgant and versatile solution for online education technology developers.

Editablity
In order for the mapping software to be a usable as possible users will beed the ability to make changes to the map without editing the .fla or swf file directly. It is for reason that the ID numbers used to create the maps should be contained in an external file which can be easily updated independently from flash.

I have chosen to use and external XML file to house all the data for the nodes as oppossed to a ".txt" file for the following reasons:

1. XML or extensible markup language can be used to eassily describe lists of items: Simple code to write by hand or generate using software.

2. XML is the closest script availble to a universal scripting language: custom tags cab be created that can be universaly understood.

3. XML cleanly seperates content and format data: Content can be resued by web pages and reformated using other CSS style sheets.

4. XML can be read by most modern web browsers: So content can be used across a site not just using flash

5. The map can be run using data from a simple RSS feed: opening a new map file is as easy as linking to a different rss feed. The map could be developed in the future to auto-create from any rss feed.

6. Flash can used to create custom XML parsers: Interprets XML data, can then make changes to a map then save to an external XML file.


xml file image

This xml file contains summary data for 3 nodes. In a typical map there may be over a hundred nodes.

Using the same concept of seperating presentation from content that using XML and CSS gives to web designers. The XML data file that holds the mapping data will always remain seperate from the XML files that hold the full content data of each node. This allows users to create multiple maps form a the same set of content data. It also allows the user to updatate and edit multimedia content independently of the map itself.

Sample XML file containing full node content

xml image

Building New Maps
Since the design of this software is with usability in mind for both designers and coders alike the ability for a coders to manually create a map by adding items to a list is just as important a designers being able to create a map usaing a graphical user interface. In future versions of the mapping software the user will be able to create a mp simple by dragging and dropping objects on to the stage. Flash will automatically calcuate the node ID using a custom built association alogorithm. But for the time being I will develop the first prototype to create new maps using direct XML editing only.

Planning The Mapping Interface

The goal of this project is to visually organize and present information in a way that compliments a users working memory or "short term memory and assists the user in exploring visual data and finding new information that is not currently being displayed.

To achieve this im am proposing to use a series of graphical nodes designed to summarize information on a topic and organize thise "nodes" into a visual map by connecting the nodes with lines or "links".

Any program attemting to describe a general set of data must be ultimately designed to organize data from a ANY subject with ANY content. Therefor it is important to make sure the structure of the map remains as flexible as possible.

With this in mind I devised a method for nodes to be conneted in a variety of ways. Nodes can be related to each other as members of a chain "sibling-sibling" or in "parent-child" relationships. This has the effects of allowing the mapping software to generate arrays of nodes that create heirachal braching chain structures.

Unique ID Number
Each "node" in the map is described using a unique identification number. It is with this number that the software program will ultimately be able to describe all the required attributes of the node such as position, scale, links and color.

Relative Addressing
The "address" of each node is encoded into the id number using a relative address system. This ensures that formatting and positioning can be controlled using group heirachys and yet still leaves room for the allocation of unique attributes.

ID Number Example
The ID number is split into a series of number clusters with the clusters seperated by dashes . Each number cluster decribes a specific node point in the relative address.

1,7-2,3-4,0

There are two numbers used to describe a node in each cluster. The first number is the "branch" number this describes the number of the branch that the node is on. The second number is the "chain" number. The describes the position that the node occupies on a chain.

The brach number or "b" around a node point is calculated by counting the number of braches in a counter clockwise manner. For example:



The chain number or "c" of a node is calcualted by counting the number of nodes before a node on a chian. For example:



Combining these numbers creates a simple for method of describing branching chains. For example:



These descriptive numbers "b" and "c" can then be used repeatedly to create braches of chains that can branch. This technique can then be used to describe and build complex series of chain branching. For example:



The next step is to build into the ID code a method for secribing child nodes. In my system child nodes are treated in essentially that same way as sibling nodes accept they are scaled to a smaller size. This will give the map the ability to display subsets of nodes in a intuitive and easy to "read" way.

To make the description of the node in the ID number as elagant as possible I simply allocated a child node the "c" value of zero. This allows a child node to easily be distingushed from a sibling node and yet still uses the same indexing system of describing brached to count how many children "branch" from a parent node. For Example:



An important reason for developing a unique ID system for each node is the fact that associative links will be created between nodes from completely different section of a map. To do this automatically from an external file each node must be able to be uniquely identified and yet still provide ainformation about its relative psoition. This also allows for a far easyer method of manually building maps using a list of ID numbers instead of trying to figure out the approximated coordinates of a node only the have it interfere with another node positioned near by in the future and have to be repositioned.

With this encoding sytem for nodes in place the next step is to create a way to convert these ID numbers into usable coordinates that can be used to place objects on screen.