Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic Set Pen & SolidBrush in JavaScript using C# Values (Read 2307 times)
Megan1717
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 39
Joined: Jun 20th, 2016
Set Pen & SolidBrush in JavaScript using C# Values
Jul 2nd, 2020 at 6:04pm
Print Post  
Hello,

We save values for link pen and solidbrush color preferences for users. On the C# side, we can set these values for existing links when drawing the diagram using the following lines of code:

Code (Java)
Select All
link.Pen = new MindFusion.Drawing.Pen(userPenColorPref);

link.Brush = new SolidBrush(userSolidBrushPref);
 



Our values are saved as ARGB and are 8 character hexadecimals. They are passed into the two MindFusion functions above as ARGB Color instance and this works just fine. The correct colors are used to draw various routes on the diagram.

What I need is a way to set these values in the JavaScript side. This was not an issue in our Silverlight MindFusion map, but is now an issue in our MVC version because we need to handle a lot of functionality client-side.

I need to be able to draw a new link with the user's preferred pen and solidbrush color on the client side. The only examples of setting the pen and solidbrush in JavaScript that I see use a 6 character hexadecimal value, such as #000000, or a string color name like "blue". I need to instead draw the link using the color values the user has set in the database, which is of type Color ARGB. Like I said, this works fine server-side, just not client-side.

I tried creating the Pen and SolidBrush object server-side since I know this gets the correct color values, but using these objects to set the corresponding pen and solidbrush values in JavaScript does not get the correct color. (Using JavaScript methods setPen() and setBrush()).

Example:

Code (Java)
Select All
//server side create the pen using user's preferred color
MindFusion.Drawing.Pen userPen = new MindFusion.Drawing.Pen(userPenColorPref);

//JavaScript clientside
//this does not result in the correct color
link.setPen('@userPen');
 



How can we accomplish this?

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


tech.support

Posts: 3147
Joined: Oct 19th, 2005
Re: Set Pen & SolidBrush in JavaScript using C# Values
Reply #1 - Jul 3rd, 2020 at 1:38pm
Print Post  
Hi,

Try this -

Code
Select All
function hexToCssColor(hex)
{
	if (hex.length != 9)
		return 'black';
	if (hex[0] != '#')
		return 'black';

	var aHex = hex.substring(1, 3);
	if (aHex == "FF")
		return "#" + hex.substring(3);

	var a = parseInt(aHex, 16) / 256;
	var r = parseInt(hex.substring(3, 5), 16);
	var g = parseInt(hex.substring(5, 7), 16);
	var b = parseInt(hex.substring(7, 9), 16);

	var Utils = MindFusion.Diagramming.Utils;
	return Utils.rgbToString(r, g, b, a);
}

node.setBrush(hexToCssColor('#88FF0000'));
 



Regards,
Slavcho
Mindfusion
  
Back to top
 
IP Logged
 
Megan1717
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 39
Joined: Jun 20th, 2016
Re: Set Pen & SolidBrush in JavaScript using C# Values
Reply #2 - Jul 6th, 2020 at 6:24pm
Print Post  
Hello,

This works perfectly. Thanks very much.
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint