sdrdis/jquery.flowchart

Link color subject to element type ?

MadTomT opened this issue · 5 comments

Hi

Lets say I have 4 different element types I can add to my flow.
Links from each should be a different color is there anyway I can do that ?

Thanks

Each link in the json can have a color property. Do the rest in the back end logic

Hi
How do I change the color of a link ?
If this is my data how can outputs 1,2 & 3 have different link colors ?

	  var operatorData = {
        top: 60 + (operatorI * 20),
        left: 500 + (operatorI * 20),
        properties: {
			title: 'Test',
			inputs: {
				input_1: {
				label: '',
				}
			},
			outputs: {
		  		output_1: {
                 label: '1',
				 id: '1_' + operatorI,
				},
				output_2: {
                 label: '2',
				 id: '2_' + operatorI,
				},
				output_3: {
                 label: '3',
				 id: '3_' + operatorI,
				},
			}
        }
      };

Thanks

Those are not links. The link is the line that goes from input to output. The link has it's own metadata in the getData data. the data looks like this :

links: Hash defining the links between your operators in your flow chart. The keys define the link ID and the value define each link's information as follow:

fromOperator: ID of the operator the link comes from.
fromConnector: ID of the connector the link comes from.
fromSubConnector: (optional) If it is a multiple connector, which subconnector is it.
toOperator: ID of the operator the link goes to.
toConnector: ID of the connector the link goes to.
toSubConnector: (optional) If it is a multiple connector, which subconnector is it.
color: Color of the link. If undefined, default value is the same as defaultLinkColor.

You are quoting the operator data - that includes the label for the inputs and outputs. You can set the class for the operator - and in that way change the colour for the whole operator but I do not think that you can just change the colour for one of the inputs.

Hi. Thanks for the reply.
I tried adding color to the links section of the above and that didn't seem to do anything. I also tried to use the following after a link was created, but I got errors the color wasn't defined..

$flowchart.flowchart('setLinkMainColor', linkId, '#006600');
Any advice on how to do this? Thanks

I don't know about the problem with setLinkMainColor - I have never used that. Try going through getData, change the data, setData and see if that works.

About the former - to be very precise there is no "link section of the above" since the above is an instance of one operator data. Operator data and link data are two separate branches from the root.