There are many solutions for this out there but I haven’t found any of them for free or as Open Source, so here we are going to learn how to make one from scratch. This version is written in Action Script 3, and it is part of the FlexTutsLibrary. If you want to know what the final product of this tutorial looks like, see it here: view Demo.
To get the FlexTutsLibrary for your projects go to the FlexTuts Library section and download the latest release.
This may be a very basic tutorial for many of you; if so, you are free to skip it and find one that make you feel you are, in fact, learning something :)
| Attachment | Size |
|---|---|
| Projects.zip | 386.14 KB |
Comments
found a bug
the lines between the nodes don't move in sync with the nodes in case the organigram is too big for the container
Help on Organigram
Hi,
I have just downloaded your code and Compiled the same where, I get 2 errors
organigram.mxml
line28: 1046: Type was not found or was not a compile-time constant: Node.
line90: 1046: Type was not found or was not a compile-time constant: Organigram.
I tried to work out the same but ended up in vain. Please do help me out...
Thanks in advance..
Regards
Hariharan D
May be the reference to the library
Hello Hariharan,
I think you need to check if the project have a reference to the library, there are two projects included, the one you are compiling needs a reference to the another.
Pls let me know if you get it compiled successfully, I don't have any compiler at this time, I'll chek it out tonight.
Best regards ;)
Jorge Sánchez
Reg: Reference to Library
Hi Jorge
We have added the .as file to the path where the MXML file is present, and the application runs perfectly.
We are trying to add a copy / cut / paste and drag and drop feature to your application. IS there any method or procedure we need to follow. we are trying very hard to implement the same. Please do help us to achieve these functions.
We thought of adding a zoom functionality to the organigram so we added this script
/*slider*/
private var TWidth:Number=0;
private var THeight:Number=0;
private function changeSize():void
{
grapharea.width=uint(TWidth*hSlider.value/100);
grapharea.height=uint(THeight*hSlider.value/100);
}
/*slider*/
the MXML code as
ft:Organigram id="organigram" nodeSelected="handleNodeSelected(event);" x="168" y="0" creationComplete="TWidth=grapharea.width; THeight=grapharea.height;"
mx:HSlider id="hSlider" minimum="0" maximum="100" value="100"
dataTipPlacement="top"
tickColor="black"
snapInterval="1" tickInterval="10"
labels="['0%','100%']"
allowTrackClick="true"
liveDragging="true"
change="changeSize();"
but when the slider is operated the nodes get disappeared leaving the sticks behind overlapped. please do guide us in this too.
Advance thanks
Regards
Hariharan D
hi
Hi,can you give me a mxml file about this example?
My email:lioony@163.com
Thanks :)
Hi!!
Hello lioony, I'm glad you are interested,
I have attached a zip file containing all you need to compile and generate the application.
Keep comming, you'll see new post here very soon.
Jorge ;)
Thanks
Thanks for your codes.
lioony :)
Iam waiting for the next
Iam waiting for the next article! :-)
Nice work! Thanks!