Label 59 : Knowledge Base
Help Topics
 
Creating Custom Markers
DOWNLOAD Working File (.Zip)
• Open Adobe Flash CS3 or higher

• Create New > Flash File (Actionscript 3.0) or Go to Menu Bar and select File > New > Flash File (Actionscript 3.0)
• Save your file as myCustomMarker.fla

• Select Layer 01 and choose the Rectangle Tool
Top
• Draw a square of any color (in our case the color is Gray) and set its dimensions to 100 x 100 px (in the Info Panel)
• Select the square and from the Menu Bar select Modify > Convert to Symbol (or Press F8)

• Name the symbol marker, select symbol type as Movie clip, Registration point should be in the center and click OK

Top
 
• Now select the square again and give it an instance name marker (in the Properties Panel)

• Double click on the square to edit the movie clip

• Insert 2 layers for the other 2 elements

• Select Frame 1 of Layer 2 and draw the second element
(In this case, we have drawn a white square 80 x 80 px and aligned it to the center)

• Select Frame 1 of Layer 3 and draw the third element
(In this case, we have drawn a yellow square 60 x 60 px and aligned it to the center)

NOTE
In this case we have aligned all the three elements to the center of the marker Movie clip as we want this marker to rotate along its center. The plus hashmark (within the Movie clip symbol) acts as the pivot point of the marker and the marker rotates along this pivot. After aligning all these elements you can select them all and move them together (using the cursor keys) to set their pivot point.


Top

• Select the yellow square in Layer 3 and convert it to symbol (go to Modify > Convert to Symbol (or Press F8))
• Name the symbol element1, select symbol type as Movie clip, Registration point should be in the center and click OK

• Now select the yellow square again and give it an instance name element1 (in the Properties Panel)

Top

• Select the white square in Layer 2 and convert it to symbol (go to Modify > Convert to Symbol (or Press F8))
• Name the symbol element2, select symbol type as Movie clip, Registration point should be in the center and click OK

• Now select the white square again and give it an instance name element2 (in the Properties Panel)

• Select the gray square in Layer 1 and convert it to symbol (go to Modify > Convert to Symbol (or Press F8))
• Name the symbol element3, select symbol type as Movie clip, Registration point should be in the center and click OK

• Now select the gray square again and give it an instance name element3 (in the Properties Panel)
Top
• Go back to Scene 1 (by exiting marker editing mode)

• From the Menu Bar select Modify > Document and change dimension to the dimensions of the square marker you have made.
In this case the dimensions of the marker symbol are 100 x 100 px (Width x Height).


Note : You can set the Marker dimensions whatever you want but the Marker and Document Dimensions should always match.

• Select the marker symbol on stage and align it to the center to the new canvas 100 x 100 px

• Now insert a new layer and name it Actions and select Frame 1 of that layer

• Open the Actions Panel by going to Window > Actions (or Press F9) and type the following Actionscript Code
Top

• While defining the markerElementsArray (in the Actions Panel), note that the name field can be set as anything but its value should always correspond to the instance name of the Movie clip that you have defined earlier. In this case the instance names of the 3 Marker Elements are element1, element2 and element3. Also note that these values are case sensitive.

• Save your file (File > Save)

• From the Menu Bar select Control > Test Movie (or Press Control + Enter on Windows or Command + Return on the Mac)

Your SWF Marker is ready for upload (the SWF file - myCustomMarker.swf will be created in the same location where
the .fla file - myCustomMarker.fla was saved)

NOTE : You only need to upload the .SWF File. DO NOT UPLOAD THE .FLA FILE

    Top
 
Copyright Label 59