Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic wrap text in TableNode cell (Read 3418 times)
Shafi
Full Member
***
Offline


I Love MindFusion!

Posts: 109
Joined: Nov 8th, 2016
wrap text in TableNode cell
Dec 9th, 2019 at 3:16pm
Print Post  
Is there any API similar to TextFormat for TableNode's Cell object in js library? I want to wrap text in tablenode cell.

https://www.mindfusion.eu/onlinehelp/flowchartnet/P_MindFusion_Diagramming_Table...
  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3152
Joined: Oct 19th, 2005
Re: wrap text in TableNode cell
Reply #1 - Dec 10th, 2019 at 9:28am
Print Post  
Text wraps out of the box in my test, as long as rows are high enough -

Code
Select All
table.redimTable(3, 3);
for (var r = 0; r < 3; r++)
{
	table.getRow(r).height = 33;
	for (var c = 0; c < 3; c++)
	{
		var cell = table.getCell(c, r);
		cell.setText("cell text test test test test test");
		cell.setFont(new Font("Arial", 4 + r + c));
	}
} 



Regards,
Slavcho
Mindfusion
  
Back to top
 
IP Logged
 
Shafi
Full Member
***
Offline


I Love MindFusion!

Posts: 109
Joined: Nov 8th, 2016
Re: wrap text in TableNode cell
Reply #2 - Dec 10th, 2019 at 1:05pm
Print Post  
I do not have word wrap by 'default'. See attachments.
In the first image, since there is some text to the side, I expect a "..." as an indication that there is some more text.

With what you suggested, I would have to manually calculate the size for each row whenever the diagram needs to update?

  

img1.png ( 2 KB | 138 Downloads )
img1.png
img2.png ( 2 KB | 141 Downloads )
img2.png
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3152
Joined: Oct 19th, 2005
Re: wrap text in TableNode cell
Reply #3 - Dec 10th, 2019 at 1:59pm
Print Post  
Quote:
With what you suggested, I would have to manually calculate the size for each row whenever the diagram needs to update?


Try table's resizeToFitText method, passing true for keepCellWidth argument.
  
Back to top
 
IP Logged
 
Shafi
Full Member
***
Offline


I Love MindFusion!

Posts: 109
Joined: Nov 8th, 2016
Re: wrap text in TableNode cell
Reply #4 - Dec 10th, 2019 at 2:57pm
Print Post  
I am unable to find resizeToFitText with arguments for TableNode in my definitions file. There are resizeToFitText with arguments but only for ContainerNode and ShapeNode.
I am using diagram-library v3.3.6.
  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3152
Joined: Oct 19th, 2005
Re: wrap text in TableNode cell
Reply #5 - Dec 11th, 2019 at 10:12am
Print Post  
I can see it available on latest 3.3.7 NPM's version -

Code
Select All
/** Resizes the columns and rows so that the cells are large enough to fit their text.
 * @param ignoreCaption true to ignore caption text and consider only cells for table size, or false otherwise.
 * @param keepCellWidth true to preserve column widths and resize only row heights, or false otherwise.
*/
resizeToFitText(ignoreCaption: boolean, keepCellWidth: boolean): void;
 



along with whatever TableNode.resizeToFitText improvements are from this release -
https://mindfusion.eu/Forum/YaBB.pl?num=1570639838

(NPM and our officials versions differ due to NPM version format being very strict, not letting us use smaller increments for patches and such)
  
Back to top
 
IP Logged
 
Shafi
Full Member
***
Offline


I Love MindFusion!

Posts: 109
Joined: Nov 8th, 2016
Re: wrap text in TableNode cell
Reply #6 - Dec 17th, 2019 at 12:31pm
Print Post  
After updating to 3.3.7, I am not able to draw link between nodes. The createDiagramLink API throws the following error:
Code (Javascript)
Select All
core.js:4799 ERROR TypeError: z.adjusted is not a function
    at c.DiagramLink.adjustRepaintBounds (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:386922)
    at c.DiagramLink.getRepaintBounds (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:143780)
    at c.DiagramLink.invalidate (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:143922)
    at Object.callBaseMethod (eval at <anonymous> (MindFusion.Common.js:1), <anonymous>:1:4253)
    at c.DiagramLink.invalidate (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:371146)
    at c.DiagramLink.updateFromPoints (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:383507)
    at Object.updateFromEndPoints (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:415682)
    at c.DiagramLink.updatePosFromOrgAndDest (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:382581)
    at Object.updateFromMasters (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:201208)
    at b.DiagramMediator.updateDependencies (eval at <anonymous> (MindFusion.Diagramming.js:6), <anonymous>:1:202707)
 

  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3152
Joined: Oct 19th, 2005
Re: wrap text in TableNode cell
Reply #7 - Dec 17th, 2019 at 1:22pm
Print Post  
Try updating your mindfusion-common module from npm and / or clearing browser cache.
  
Back to top
 
IP Logged
 
Shafi
Full Member
***
Offline


I Love MindFusion!

Posts: 109
Joined: Nov 8th, 2016
Re: wrap text in TableNode cell
Reply #8 - Jan 7th, 2020 at 2:23pm
Print Post  
Updating to the latest library solves the wrapping issue. However, there is 1 issue.

I initially create the node using this code.
Code (Javascript)
Select All
this.diagram.getFactory().createTableNode(20, 80, 55, 30);
 



Then I use resizeToFitText(false, true) to wrap the text. The problem is that, if the text can fit without issue in the initially supplied width, it still shrinks the node to the text width. Is there a way to provide minimum width to the node so that it does not shrink further than that?

See attachments
  

initial.png ( 1 KB | 133 Downloads )
initial.png
After_WRAP.png ( 3 KB | 131 Downloads )
After_WRAP.png
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3152
Joined: Oct 19th, 2005
Re: wrap text in TableNode cell
Reply #9 - Jan 8th, 2020 at 8:38am
Print Post  
There isn't, you will need to resize it back to the min width after fitting text -

Code
Select All
var minWidth = ...;
node.resizeToFitText(false, true);
var nb = node.getBounds().clone();
if (nb.width < minWidth)
{
	nb.width = minWidth;
	node.setBounds(nb);
} 



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