hamburger menu
+ Create a topic
Solved

How do I visualize that a rule is toggled on / off with conditional formatting in Lucidchart?

S
Badge +1

Dear Community Members,

I'm seeking assistance regarding a visualisation issue 

I'm looking for a method to clearly indicate whether a rule is toggled on or off. 

Context: In the attached screenshot, you'll notice buttons labeled with co-owning department names. These buttons contain an action that toggles specific rules on / off upon clicking. When a rule is activated, parts of a process not owned by the designated department are grayed out.

The problem: There's currently no visual indication on the button itself to signify whether the rule is active or inactive. Ideally, I would like the button's color to change to green when the associated rule is toggled on and gray when it's off. Otherwise, users might confuse which rule they toggled on and need to toggle off again to see the full process and its colour coding. 

Could anyone provide insight on how to achieve this? Your assistance would be greatly appreciated.

Thank you.

Hope this visualized the problem a bit. Ideally the “Getting Started” button would not change colour. This would tremendously add to the interactivity I could offer the users and make it more user friendly. 

 

icon

Best answer by Humas1985 24 March 2024, 02:01

View original

Comments

Humas1985
Rank
Userlevel 5
Badge +7

Hi @Semih Gunel 

 

Just simplifying your use case just to double check – You are trying to achieve visually indicate whether a rule is toggled on or off right ? specifically by changing the button color to green when the rule is on and gray when it's off. This would provide a clear visual indication for users and prevent confusion.

If my understanding is right – please try the below steps:

  • Add a "Rule Active" parameter to your button:

Create a new parameter (e.g., "Rule Active") and set its data type to "Boolean". This parameter will store the status of the rule (true = on, false = off).

  •  Update the button's appearance based on the parameter:

Use Lucid's conditional formatting feature to change the button's color based on the "Rule Active" parameter. For example:

               * If "Rule Active" = true, set the button color to green.

               * If "Rule Active" = false, set the button color to gray.

  • Update the parameter value when the rule is toggled:

When the user clicks the button, use a script or action to update the "Rule Active" parameter accordingly. For example:

               * If the rule is currently off (parameter = false), set it to true (on).

               * If the rule is currently on (parameter = true), set it to false (off).

 

 

Hope this helps - Happy to help further!!
Thank you very much and have a great one!

Warm regards

Huma Lucid Legend-2
S
Badge +1

Hi @Humas1985 ! 

First of all, thanks a lot for your reply and taking the time. 

I think you have a good idea there. Unfortunately, I do not know how to add parameters and adding scripts that update the parameter state. I will have to read into this first and then will reply if I need more help. 

I do have a lot (>50) of these buttons that toggle on/off rules. If I understand right, trying the solution you proposed also allow me to be copy/paste it all buttons once done, right ? 

I was hoping there would be a more intuitive way to realize this as I thought that the option of toggling rules on/off on a shape should come hand in hand with an indicator 😅. 

Thanks a lot again ! 

G
Badge

Hi @Humas1985 ,

I would really appreciate some more instruction/steps on how to create the Boolean parameter in my shape data. Creating the conditional formatting is straightforward but I would love to know how the parameter is created. 

Humas1985
Rank
Userlevel 5
Badge +7

Hi @Gelsac 

You are trying to find some steps in this sort ? if so take a look and keep us posted - we can do the Boolean parameter

 

  • Choose the button shape for the rule.
  • Go to the Data tab (on the right).
  • Click "Parameters" and then "+" to add a new one.
  • Name it "Rule Active" 
  • Set the data type to "Boolean" (True/False).
  • Leave the value blank for now.
  • Click "OK" to save the parameter.

Lucid Formulas

 

 

Hope this helps - Happy to help further!!
Thank you very much and have a great one!
Warm regards

Huma Lucid Legend-2
Humas1985
Rank
Userlevel 5
Badge +7

Hi @Semih Gunel - I understand your concerns about adding parameters and scripts.

You can also refer here for more information - Level up Your Diagramming with Conditional Formatting | Lucidchart

 

Regards.

Huma Lucid Legend-2
G
Badge

Thank you so much! The issue I am having is that within the data panel, I can’t find the option ‘Parameter’. I am putting a screenshot here. I added a custom data field but how do I make it a specific data type? Please let me know if I am choosing the wrong options.

 

 

Humas1985
Rank
Userlevel 5
Badge +7

Hi @Gelsac - Thanks for adding the snapshot and this helps to understand better, we cannot add Boolean within the custom data panel, we have to think of other possibilities.

Will take it to our super supporter to grab additional thought process

 

Hi @Sylvia X - Can you please help finding the best solution to this situation?

 

Regards

Huma Lucid Legend-2
Sylvia X
Userlevel 2
Badge +3

Hi @Gelsac and @Semih Gunel, unfortunately adding parameters to the custom data field in Lucidchart is currently not supported. 

If you would like for this to be a feature, please feel free to share your request in our Product Feedback space of this community and our product team will take this into consideration. 

 

@Semih Gunel, to address your use-case with buttons indicating whether rules are active or inactive, you could alternatively do this with just conditional formatting and without any parameters. Free to follow these steps below:

  • Create a new conditional formatting rule to detect whether a button has changed colour using the following formula:  
    =ISCOLOR("#D6DBE1",True)
    This is what the rule should look like: 

    For the Hex code, please replace this with the colour of your button currently after you toggle the rule on (I have it set to the colour gray). If the colour is a custom colour, you should be able to see this in your Fill colour menu (see screenshot below). Also, for the And condition, feel free to replace the Text value with whatever text is on your button. 

     

  • Select your button and add this new rule to your toggle. You can check the boxes to apply multiple rules. 
     

     

  • Repeat this process for each button you want to toggle on/off and show as active/inactive. I’ve attached a GIF of what the end result should look like. 

 

I hope this helps! If this doesn’t quite address what you are trying to achieve, please don’t hesitate to leave a comment below with further details. :) 

S
Badge +1

UPDATE: It took a minute but now I got it ! Brilliant thanks a lot !!! Solved. Super nice. 

Hello @Sylvia X, I appreciate your thorough response.

My default box color is grey, and it includes a toggleable rule. However, the box color remains unchanged regardless of whether the rule is on or off. What confuses me is how applying conditional formatting to the grey box, which detects a color change, actually alters the box's color.

For the conditional format to function properly (detecting a color change), the color needs to shift to green when the rule is toggled on (by clicking the grey box). I aspire for it to behave like the example you provided, but I'm unsure how to automatically change the box's color from grey to green when I activate the rule. Could you please shed some light on this?

Thank you very much in advance!

G
Badge

Thank you @Sylvia X , I was able to apply your instructions and it is working as expected. 

@Semih Gunel , I would like to try and answer your question. For the box’s color to change from grey to green, did you set up the ‘then’ portion of your formula ? 
 


In addition, once this step is complete, I had to hide the formula first and then apply the toggle Actions. 
 

 

Reply


Lucid Software Inc. Supplemental Community Terms

Get Started

Products

Solutions

Resources

Company

Privacy Legal Cookie Policy Cookie Settings
©   2024  Lucid Software Inc.