|
i edited this code for use in my family tree concept but there are some problem nodes are shown very small i want to resize it to big size i attched my code files any body can hrlp me.....
here is my code [code javascript]var Diagram = MindFusion.Diagramming.Diagram;
var Behavior = MindFusion.Diagramming.Behavior;
var AbstractionLayer = MindFusion.AbstractionLayer;
var Alignment = MindFusion.Diagramming.Alignment;
var AnchorPattern = MindFusion.Diagramming.AnchorPattern;
var Shape = MindFusion.Diagramming.SimpleShape;
var Font = MindFusion.Drawing.Font;
var Rect = MindFusion.Drawing.Rect;
var Text = MindFusion.Drawing.Text;
var Thickness = MindFusion.Drawing.Thickness;
var Event = MindFusion.Diagramming.Events;
var GlassEffect = MindFusion.Diagramming.GlassEffect;
var Style = MindFusion.Diagramming.Style;
var SimpleShape = MindFusion.Diagramming.SimpleShape;
var ImageAlign = MindFusion.Diagramming.ImageAlign;
var LinkShape = MindFusion.Diagramming.LinkShape;
var Shape = MindFusion.Diagramming.Shape;
var id = 0;
// creates a shape node with the default settings
var OrgChartNode = function (parent, boss)
{
AbstractionLayer.initializeBase(OrgChartNode, this, [parent]);
this.childNodes = [];
this.setFont(new Font("TERAFONT-PARTH", 8, true /*bold*/, false /*italic*/));
this.setEnableStyledText(true);
// customize appearance
this.setHandlesStyle(MindFusion.Diagramming.HandlesStyle.MoveOnly);
this.setEnableStyledText(true);
this.setBrush("purple");
this.setShape("RoundRect");
this.setFullName("Name");
this.setImagePadding(new Thickness(0, 0, 0, 0));
this.setImageLocation("team-placeholder.jpg");
this.setId();
this.setBoss(boss);
this.setHierarchy();
this.resize();
this.setAnchorPattern(AnchorPattern.fromId("TopInBottomOut"));
}
OrgChartNode.prototype =
{
// updates the existing elements
updateCanvasElements: function (node)
{
this.setFields();
AbstractionLayer.callBaseMethod(OrgChartNode, this, 'updateCanvasElements');
},
// gets the full name of the employee
getFullName: function ()
{
return this.fullName;
},
// sets the full name of the employee
setFullName: function (value)
{
if (this.fullName !== value)
{
this.fullName = value;
this.invalidate();
}
},
// gets the comments about the employee
getComment: function()
{
return this.comments;
},
// gets the comments about the employee
setComment: function(value)
{
if (this.comments !== value)
{
this.comments = value;
this.invalidate();
}
},
// assigns an id to the employee
setId: function ()
{
this.id = id;
id++;
},
// gets the id that was assigned to the employee
getId: function()
{
return this.id;
},
// assigns the employee data to the table cells
setFields: function()
{
this.setText(this.fullName);
this.setImagePadding(new Thickness(0,0,0,0));
this.setImageAlign(ImageAlign.Fit);
// rearrange the org hierarchy
this.setHierarchy();
this.setColor();
},
// resize the node to guarantee that all data would fit
resize: function()
{
// var oldHeight = this.bounds.height;
// var oldImageWidth = this.getImage().width;
//resize the node to fit the text
//this.resizeToFitText(MindFusion.Diagramming.FitSize.KeepRatio);
//add or remove the necessary space to fit the image well
// var newHeight = this.bounds.height - oldHeight;
// this.getImagePadding().top += newHeight/2;
// this.getImagePadding().bottom += newHeight / 2;
// this.getImage().width = oldImageWidth;
// this.bounds.width += oldImageWidth;
},
// assigns the specified boss as the employee's boss
setBoss: function(boss)
{
if (boss != this.boss)
{
this.boss = boss;
this.setHierarchy();
this.invalidate();
}
},
// rebuilds the hierarchy
setHierarchy: function ()
{
// the ceo has no boss
if (this.boss == undefined)
{
this.hierarchy = 0;
}
else
{
// first level of executives under the boss
if (this.boss.hierarchy == undefined)
{
this.hierarchy = 1;
}
else
{
// increase the depth of the hierarchy
this.hierarchy = this.boss.hierarchy + 1;
this.boss.addChild(this);
}
}
// rearrange the hierarchy
for (var i = 0; i < this.childNodes; i++)
this.childNodes[i].setHierarchy();
this.setColor();
},
// picks up a color based on the hierarchy level
setColor: function()
{
var hierarchyLevel = this.hierarchy % 6;
switch (hierarchyLevel)
{
case 0:
this.setBrush("maroon");
break;
case 1:
this.setBrush("maroon");
break;
case 2:
this.setBrush("maroon");
break;
case 3:
this.setBrush("maroon");
break;
case 4:
this.setBrush("maroon");
break;
case 5:
this.setBrush("maroon");
break;
case 6:
this.setBrush("maroon");
break;
default:
this.setBrush("maroon");
break;
}
},
// adds a new employee
addChild: function(child)
{
//checks if the employee already exists
var isHere = false;
for (var i=0 ; i<this.childNodes.length;i++)
{
if(this.childNodes[i].id == child.id)
isHere = true;
}
if (!isHere)
this.childNodes.push(child);
},
// removes the specified child from the collection of nodes
removeChild: function(child)
{
var index = this.childNodes.indexOf(child);
if(index > -1)
this.childNodes.splice(index,1);
},
// rearranges the hierarchy
resetHierarchy: function()
{
this.setHierarchy();
for (var i=0 ; i<this.childNodes.length;i++)
{
this.childNodes[i].setBoss(this);
this.childNodes[i].resetHierarchy();}
},
// checks if the specified node is a child node
isChild: function(child)
{
for (var i=0;i<this.childNodes.length; i++)
{
if (child === this.childNodes[i])
return true;
}
return false;
}
};
var diagram = null;
var tree = null;
$(document).ready(function () {
AbstractionLayer.registerClass(OrgChartNode, "OrgChartNode", MindFusion.Diagramming.ShapeNode);
// we apply the tree layout to arrange the diagram
tree = new MindFusion.Graphs.TreeLayout();
// customize the tree layout
tree.direction = MindFusion.Graphs.LayoutDirection.TopToBottom;
tree.linkType = MindFusion.Graphs.TreeLayoutLinkType.Cascading;
// create the diagram object and apply customization
$("#diagram")[0].oncontextmenu = function () { return false; }
diagram = Diagram.create($("#diagram")[0]);
var defaultStyle = new Style();
defaultStyle.setTextColor("Yellow");
defaultStyle.setFontSize(7);
defaultStyle.setFontStyle("Bold");
diagram.setStyle(defaultStyle);
diagram.setBehavior(Behavior.Custom);
diagram.setShowGrid(false);
diagram.setAllowSelfLoops(false);
diagram.setAutoScroll(true);
diagram.setLinkShape(LinkShape.Cascading);
diagram.setBackBrush('red');
//var pfc = new PrivateFontCollection();
//pfc.AddFontFile("C:\Users\Akshay\Downloads\Terafonts\TERAFONT-PARTH.TTF");
//myLabel.Font = new System.Drawing.Font(pfc.Families[0], 20, System.Drawing.FontStyle.Regular);
//add an EventListener for clicked events
diagram.addEventListener(Event.clicked, function (diagram, eventArgs) {
// check which mouse button was clicked
var button = eventArgs.getMouseButton();
var position = eventArgs.getMousePosition();
// click with the right mouse button creates a node
if (button === 2) {
var node = new OrgChartNode(diagram, undefined);
node.setBounds(new Rect(position.x, position.y, 5, 5));
node.resize();
// adds the node to the diagram items
diagram.addItem(node);
// rearrange the diagram
diagram.arrangeAnimated(tree);
}
});
diagram.addEventListener(Event.animatedLayoutCompleted, function (diagram, eventArgs) {
// resize the diagram to fit all items
diagram.resizeToFitItems();
});
diagram.addEventListener(Event.nodeClicked, onNodeClicked);
// add an EventListener for nodeSelected events
diagram.addEventListener(Event.nodeSelected, function (diagram, eventArgs) {
// make sure the clicked node appears above any other nodes at the same location
eventArgs.getNode().setZIndex(0);
});
// raised when the user deselcts a node
diagram.addEventListener(Event.nodeDeselected, function (diagram, eventArgs) {
//reset the z-index of the node
eventArgs.getNode().setZIndex(0);
});
//add an eventListener for the linkCreated event
diagram.addEventListener(Event.linkCreated, onLinkCreated);
// add an EventLitener for the linkCreated event
diagram.addEventListener(Event.linkCreated, function (diagram, eventArgs) {
diagram.arrangeAnimated(tree);
});
// add an eventListener for the nodeDeleted event
diagram.addEventListener(Event.nodeDeleted, function (diagram, eventArgs) {
diagram.arrangeAnimated(tree);
})
// add an eventListener for the linkDeleted event
diagram.addEventListener(Event.linkDeleted, function (diagram, eventArgs) {
// gets the destinationNode for the link that is deleted
var destNode = eventArgs.getLink().destination;
// remove the destinationNode as a subordinate to the boss of the destination node
destNode.boss.removeChild(destNode);
// destinationNode now has no boss
destNode.boss = undefined;
// reset the hierarchy for the destination node
destNode.resetHierarchy();
destNode.setText("");
diagram.arrangeAnimated(tree);
});
// handles nodeModified events
diagram.addEventListener(Event.nodeModified, function (diagram, eventArgs) {
// if the modified node does not have a boss
if (!(eventArgs.getNode().boss)) {
// get the mouse position
var mousePoint = eventArgs.getMousePosition();
// and all nodes at this position
var nodes = diagram.getNodesAt(mousePoint);
for (var i = 0; i < nodes.length; i++) {
// if the node is not the one being modified and is not child of the one being modified
if (nodes[i] !== eventArgs.getNode() && !eventArgs.getNode().isChild(nodes[i])) {
// set nodes[i] as boss for the modified node
eventArgs.getNode().setBoss(nodes[i]);
// create a diagramLink to show the hierarchy
var l = diagram.getFactory().createDiagramLink(nodes[i], eventArgs.getNode());
// apply link design
styleLink(l);
// reset the node hierarchy
eventArgs.getNode().resetHierarchy();
// rearrange the diagram
diagram.arrangeAnimated(tree);
// resize the diagram to fit all items
diagram.resizeToFitItems();
break;
}
}
}
})
// create some sample nodes e.g. employees
var kanji = new OrgChartNode(diagram);
kanji.setBounds(new Rect(25, 15, 10, 10));
kanji.setText("");
kanji.resize();
diagram.addItem(kanji);
// var pfc = new PrivateFontCollection();
// pfc.AddFontFile("C:\Users\Akshay\Downloads\Terafonts\TERAFONT-PARTH.TTF");
// kanji.Font = new System.Drawing.Font(pfc.Families[0], 20, System.Drawing.FontStyle.Regular);
var surji = new OrgChartNode(diagram, kanji);
surji.setBounds(new Rect(25, 55, 10, 10));
surji.setBoss(kanji);
//surji.setTitle("CTO");
surji.setFullName(";]ZÒ");
//surji.setImageLocation("cto.png");
//surji.setComment("A great person!");
surji.resize();
diagram.addItem(surji);
var bhanji = new OrgChartNode(diagram, kanji);
bhanji.setBounds(new Rect(95, 55, 10, 10));
//bhanji.setTitle("HR");
bhanji.setFullName("EF^FÒ");
//bhanji.setImageLocation("hr.png");
//bhanji.setComment("Human Relations Manager");
bhanji.resize();
diagram.addItem(bhanji);
var ladha = new OrgChartNode(diagram, bhanji);
ladha.setBounds(new Rect(95, 95, 10, 10));
//ladha.setTitle("PR");
ladha.setFullName(",WFvJLZAF>");
//ladha.setImageLocation("pr.png");
ladha.resize();
diagram.addItem(ladha);
var samji = new OrgChartNode(diagram, ladha);
samji.setBounds(new Rect(95, 135, 10, 15));
//samji.setTitle("Media");
samji.setFullName(";FDÒvDFGAF>");
//samji.setImageLocation("ad.png");
samji.resize();
diagram.addItem(samji);
var ramji = new OrgChartNode(diagram, samji);
ramji.setBounds(new Rect(95, 175, 10, 15));
//ramji.setTitle("Media");
ramji.setBoss(samji);
ramji.setFullName("ZFDÒvC\\;FA[G");
//ramji.setImageLocation("ad.png");
ramji.resize();
diagram.addItem(ramji);
var kantaben = new OrgChartNode(diagram, samji);
kantaben.setBounds(new Rect(95, 175, 10, 15));
//naran.setTitle("Media");
kantaben.setFullName("SF\TFA[G");
//naran.setImageLocation("ad.png");
kantaben.resize();
diagram.addItem(kantaben);
var naran = new OrgChartNode(diagram, samji);
naran.setBounds(new Rect(95, 175, 10, 15));
//naran.setTitle("Media");
naran.setFullName("GFZF^FvhJ[ZA[G");
//naran.setImageLocation("ad.png");
naran.resize();
diagram.addItem(naran);
var shantaben = new OrgChartNode(diagram, samji);
shantaben.setBounds(new Rect(95, 175, 10, 15));
//naran.setTitle("Media");
shantaben.setFullName("XF\TFA[G");
//naran.setImageLocation("ad.png");
shantaben.resize();
diagram.addItem(shantaben);
var Hiravatiben = new OrgChartNode(diagram, samji);
Hiravatiben.setBounds(new Rect(95, 175, 10, 15));
//naran.setTitle("Media");
Hiravatiben.setFullName("CLZFJlTA[G");
//naran.setImageLocation("ad.png");
Hiravatiben.
|
Pages: 1
i want to resize each node (Read 1648 times)
