- Welcome, Guest. Please Login or Register
MindFusion  
  We are soon releasing MindFusion.JavaScript pack. Initial version includes chart, diagram, calendar, map, virtual keyboard, gauge and UI components. Here are the beta version and live demo for anyone interested.  
  HomeHelpSearchLoginRegister   
     
     
   
 
Page Index Toggle Pages: 1 Send Topic Print  
Define 4 corners of a shape node
Read 85 times

Ngo Duc Quang   Offline
YaBB Newbies
*
Posts: 8
Gender: male
Ha Noi
I Love MindFusion!


   
     
 
Define 4 corners of a shape node
Jul 9th, 2019 at 4:06am
 
Hi, I have a Json string that contains data of a node list and a link list (json retrieved from the server), I have some problems:
- In the image file I have attached, in the red circle area, the node creates the link itself. how to fix it?
- I want to define 4 corners of a shape node (top, bottom, left, right) to create the correct link?

I want to show you a part of my Json data:
"linkDataArray" : [
{
"from" : 1, // id shape node from
"to" : 3, // id shape node to
"fromPort" : R, // The starting position of the link (R: right, L: left, T: top, B: bottom)
"toPort" : L, // End position of link
"visible" : true,
"text" : Điều kiện,
"isDeletable" : false,
"points" : null
}
]
The above json section shows when creating the link.

 
 
 
IP Logged    
 
     

Slavcho   Offline
God Member
*****
Posts: 1718
Gender: male
tech.support


   
     
 
Re: Define 4 corners of a shape node
Reply #1 - Jul 9th, 2019 at 8:45am
 
Quote:
- In the image file I have attached, in the red circle area, the node creates the link itself. how to fix it?


If you call createDiagramLink(sameNode, sameNode), the control assigns a self-loop Bezier shape to it, but that doesn't seem to consider the case when the self-loop link connects different anchor points. After creating the link and assigning the anchor points, you can set the link shape to whatever you like, e.g. try something like this -

Code:
PointF start = link.getStartPoint();
PointF end = link.getEndPoint();
link.setShape(LinkShape.Polyline);
link.setSegmentCount(4);

// case for right to top directon
PointList points = link.getControlPoints();
points.set(0, start);
points.set(1, new PointF(start.x + offset, start.y));
points.set(2, new PointF(start.x + offset, end.y - offset));
points.set(3, new PointF(end.x, end.y - offset));
points.set(4, end));
link.updateFromPoints() 



Quote:
- I want to define 4 corners of a shape node (top, bottom, left, right) to create the correct link?


Copy the first AnchorPattern definition from AnchorPoints sample project and assign it to your nodes, and then match your R/L/T/B port values to the respective point indices when you call setOriginAnchor / setDestinationAnchor.

Regards,
Slavcho
 
 
 
IP Logged    
 
     
Page Index Toggle Pages: 1 Send Topic Print