Page Index Toggle Pages: 1 [2]  Send TopicPrint
Hot Topic (More than 10 Replies) Need to draw similar kind of component in angular2 shown in pic (Read 7936 times)
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3147
Joined: Oct 19th, 2005
Re: Need to draw similar kind of component in angular2 shown in pic
Reply #15 - Mar 22nd, 2017 at 2:13pm
Print Post  
If you need that for the whole diagram, set its Behavior property to DoNothing. If you need it for individual nodes, set their Locked property to true.
  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3147
Joined: Oct 19th, 2005
Re: Need to draw similar kind of component in angular2 shown in pic
Reply #16 - Mar 28th, 2017 at 2:09pm
Print Post  
Try updated scripts and .ts here -
https://mindfusion.eu/_beta/typescript_customdraw.zip

1. The definition file now lets you do custom drawing from Typescript instead of using attached nodes, which should give you better performance -

Code
Select All
function onUpdateVisuals(item: MindFusion.Diagramming.DiagramItem): void
{
 var rect = item.bounds;

 var rectPath = new MindFusion.Drawing.Path();
 rectPath.addRect(rect.x + 2, rect.y + 2, 6, rect.height - 4);
 rectPath.setPen("#FF0000");
 rectPath.setBrush("orange");
 item.getGraphicsContent().push(rectPath);

 var trianglePath = new MindFusion.Drawing.Path();
 trianglePath.moveTo(rect.x + 10, rect.y + rect.height / 2);
 trianglePath.lineTo(rect.x + 30, rect.y + rect.height / 2);
 trianglePath.lineTo(rect.x + 20, rect.y + rect.height / 2 + 10);
 trianglePath.lineTo(rect.x + 10, rect.y + rect.height / 2);
 trianglePath.close();
 trianglePath.setPen("FF0000");
 trianglePath.setBrush("transparent");
 item.getGraphicsContent().push(trianglePath);

 var nodeText = new MindFusion.Drawing.Text("text", new MindFusion.Drawing.Rect(rect.x + rect.width, rect.y, 20, 20));
 nodeText.setFont(new MindFusion.Drawing.Font("sans-serif", 4, false, true, false));

 item.getGraphicsContent().push(nodeText);
}

MindFusion.Diagramming.ShapeNode.prototype.onUpdateVisuals = onUpdateVisuals; // or instance.onUpdateVisuals = onUpdateVisuals;
 



2. You can find ContainerNode.setFoldIconSize method that lets you assign fixed size to the fold icon so it won't fill your larger caption bars.

Regards,
Slavcho
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1 [2] 
Send TopicPrint