Conditional Visibility lets you show or hide any element in a graphic based on the value of a variable, a data connector field, or a boolean expression — without changing the graphic layout or publishing a new version.
Use cases
Showing a "GOAL" badge only when a score event occurs in a data feed.
Switching between a short list layout and a long list layout based on the number of items.
Hiding a sponsor logo during specific segments of a broadcast.
Displaying different content depending on a team name, game state, or boolean flag in a Google Sheet.
Showing a data-driven element only when the connected field has a value.
Prerequisites
You have editor access to a Graphics Package in Viz Flowics.
The element you want to control (Building Block, Overlay, Region) is added to the Elements Tree.
If driving the condition from a data source, the Data Provider is connected and syncing.
How it works
Conditional Visibility is a property set on individual elements in the Inspector. When the condition evaluates to true, the element is visible. When it evaluates to false, the element is hidden — without affecting the layout of surrounding elements or requiring an Overlay trigger.
Conditions are evaluated each time the variable or data field updates. The element shows or hides automatically as the data changes.
Key rules to understand
Boolean TRUE and string "TRUE" are treated differently. A Google Sheets formula may return a boolean
TRUEor a string"TRUE"depending on how the cell is formatted. Flowics treats these as different types. If your condition is not working, check whether the value is a boolean or a string and set the operator accordingly.Changes in the Editor do not take effect until you publish. After configuring a condition, publish the package and click Update in the Remote Control before testing on the Output.
Conditional Visibility and Overlay triggers are independent. An Overlay must be triggered IN for its contents to be visible — Conditional Visibility only controls whether individual elements inside an active Overlay are shown or hidden.
Step-by-step guide
Step 1 — Select the element
In the Graphics Editor, select the element you want to control — a Building Block, Overlay, or Region.
Step 2 — Open the Visibility section in the Inspector
In the Inspector (right sidebar), find the Visibility section. It is collapsed by default — click to expand it.
Step 3 — Set the condition
Choose the variable or data field that will drive the visibility. Then set the comparison operator and the value to match:
Equals (
=) — element is visible when the field exactly matches the value.Not equals (
≠) — element is visible when the field does not match the value.Greater than / Less than — for numeric comparisons.
Is empty / Is not empty — for fields that may have no value.
Step 4 — Publish and test
Click Publish, then open the Remote Control and click Update. Trigger the Overlay IN and verify the element shows or hides correctly as the data changes.
Best practices
Use string matching for boolean fields from Google Sheets. Setting the condition to match
TRUEorFALSEas a string works reliably regardless of whether the cell returns a boolean or a string.Test conditions with real data before the broadcast. Conditional Visibility depends on the actual value in the data source — test with the same data format you will use on-air.
Use separate Overlays for layouts that are structurally different. Conditional Visibility is best for toggling individual elements. If the entire layout changes (e.g. different number of columns), use two Overlays with their own visibility logic instead.
Reduce the number of simultaneous conditions on performance-sensitive packages. Each condition adds evaluation overhead. For packages with large data sources and many conditional elements, simplify where possible.
Troubleshooting
The condition is set but the element is not hiding or showing
Common causes:
The package has not been published since the condition was set.
The variable value does not match what the condition expects.
The Data Connector has stale data.
How to fix:
Publish the package and click Update in the Remote Control.
Open the Remote Control and check the current value of the variable driving the condition. Confirm it matches exactly — extra spaces, wrong case, or unexpected formatting will cause the condition to fail.
Click Synchronize Connector on the Data Provider to force a fresh data pull.
Boolean values are not working correctly
If a Google Sheets formula returns a boolean (TRUE/FALSE) but the condition is not evaluating correctly:
Set the condition operator to
=and the value toTRUEorFALSEas a string. This works whether the cell returns a boolean or a string.If the condition must match a boolean specifically, check whether the Data Provider is interpreting the cell as a boolean or a string — the Inspector shows the value type next to the variable name.
Tip: If the same formula returns a boolean in one template but a string in another, use string matching (TRUE / FALSE) as the consistent approach across all templates.
The condition works in the Editor but not on the Output
Common causes:
The package was not published after configuring the condition.
The Output Profile is filtering the element's Region.
Performance issues are causing slow evaluation.
How to fix:
Confirm the package has been published after making the visibility change.
If the Output URL uses a
?profile=parameter, verify the element's parent Region is tagged for that profile — an untagged Region will not render at all, independently of the condition.If show/hide transitions appear slow or "sloppy," check Dynamic List item counts — large data ranges cause evaluation lag across the entire package.
I need to show different content based on a value, not just hide/show
If you need different text, images, or layouts depending on a data value:
Option 1 — Multiple overlapping elements with conditions: Create two versions of the element in the same Region, each with its own Conditional Visibility. Only the one whose condition is true will be visible at any given time.
Option 2 — A single data binding that changes value: Bind the element to a field that already contains the correct value for each state. For example, bind an image URL field to a column in Google Sheets that contains different URLs depending on the game state.
Common expressions reference
Goal | Operator | Value |
Show when the boolean is true |
| (no value needed) |
Show when string equals TRUE |
|
|
Show when the score is above zero |
|
|
Show only when the field has a value |
| (no value needed) |
Show when team matches |
|
|
Hide when the field is empty |
| (no value needed) |
When to contact support
Contact the support team if:
A condition evaluates correctly in the Editor but behaves differently on the Output after publishing.
A variable type (boolean vs string) is inconsistent across templates and cannot be resolved with string matching.
Conditional Visibility is causing unexpected performance issues in a package.
When contacting support, include: your Graphics Package URL, a screenshot of the Visibility settings in the Inspector, and the current value of the variable as shown in the Remote Control.