Show a tank fill animation with a bar meter object

7 min read · Published November 12, 2026

Keep the tank artwork as the fixed background and make the liquid a separate meter image inside one bar meter object driven by the level register. Set the meter's low and high limits to the register's real span from the PLC logic, then release only after the screen agrees at empty, mid-span and full.

Keep the tank still and move only the liquid: put the tank artwork in the Background image field of a bar meter object, put the liquid artwork in its Meter image field, and drive the object from the level register. Scaling one bitmap by the register stretches the tank walls together with the fill, so the vessel looks like it grows and shrinks. The bar meter splits the picture into a fixed layer and a value-driven layer, which is the split a fill animation needs. Set the meter's limits to the register's true span, then release the screen only after it agrees with the register at empty, mid and full. The sections below cover what to prepare, the object settings in order, the range math, and the three-point test.

Why does scaling one bitmap stretch the whole tank?

Because the editor scales the whole picture: when you tell a bitmap object to resize in X, Y or both dimensions by a register value, every part of that bitmap, tank walls included, changes size with the value. The fill and the vessel share the same pixels, so no scaling setting keeps one still while the other moves. A bitmap object carries one image on one rectangle, and a fill graphic needs two layers: one that never changes and one that follows the register. That division of labor is why the right object is a meter, not a scaled picture.

Which HMI object keeps the tank static and the fill moving?

The bar meter object: its Background image field holds the stationary tank artwork, its Meter image field holds the liquid, and the register moves only the meter layer while the vessel stays fixed. Both fields sit on the object's Options tab in the HMI editor; if your editor version words the fields differently, they are the two image slots on the bar meter's options page. Because one object owns both images, the layers stay aligned: draw each image to the same pixel size and the liquid stays registered to the vessel at every value.

What do you need before you build the fill graphic?

Three things: two pieces of artwork drawn to the same pixel rectangle at the panel's native resolution, the level register's address with its true low and high counts from the PLC logic, and a direction decision, meaning whether the fill should rise or fall as the count rises.

Split the artwork that way from the start. Keep the vessel outline, welds, graduation marks and fittings in the background drawing, and put only liquid in the meter drawing. If part of the outline is baked into the meter image, that part animates with the fill and the vessel appears to breathe.

Open the PLC logic and the analog input's scaling before you enter any limit. A raw-count register stores the input's whole span: a 12-bit analog input spans 0 to 4095 counts. Some scaled analog blocks span 0 to 3200 counts, and a scaled word can hold straight percent, 0 to 100. Each family needs different meter limits, and a value of 100 in a raw-count register is 100 ÷ 3200 = 3.1% of a 3200-count span, nearly empty on screen.

Decide direction now. Most tanks fill bottom-up as the count rises; a register holding remaining volume counts down while the vessel empties, and the meter's range or direction setting has to make the picture read true.

This setup also assumes the panel and editor already talk to the PLC. If you are still choosing hardware, run the HMI panel startup and runtime checks before building graphics on top.

How do you configure the bar meter object?

Place a bar meter object, open its Options tab, assign the tank drawing to the Background image field and the liquid drawing to the Meter image field, point the value source at the level register, and set the low limit, high limit and fill direction from the register's span.

  1. Open the tank screen in the HMI editor and place a Bar Meter object where the vessel will sit.
  2. On the object's Options tab, set the Background image field to the tank artwork and the Meter image field to the liquid artwork.
  3. Point the object's value source at the level register, addressed exactly as the PLC logic prints it.
  4. Enter the register's low and high limits in the range fields; the worked example below uses 0 and 3200 counts.
  5. Set the fill direction so the liquid rises from the bottom edge, or falls if the register counts down.
  6. Size the object so both images render at their drawn pixel size, with no editor scaling applied.

Check the object in the editor before you download anything: both image slots filled, the value source on the right register, the limits entered. Preview on the panel itself where you can, because editor previews can size text and objects differently from the panel; the editor and panel size mismatch article shows what that difference looks like.

How do you match the meter range to the register's scaling?

Set the meter's low and high limits to the numbers the register actually stores: raw analog counts span the input's full range (a 12-bit input spans 0 to 4095 counts), some scaled blocks span 0 to 3200 counts, and a percent word spans 0 to 100.

Enter the wrong high limit and the picture saturates. With a percent-word span entered against a raw-count register, the screen reads full from 100 counts up, and 3100 ÷ 3200 = 96.9% of the real span never appears. With 0 to 4095 entered against a 3200-count span, the fill stalls at 3200 ÷ 4095 = 78.1% while the tank is full.

For a numeric readout beside the tank, percent full = (value − low) ÷ (high − low) × 100, computed in the PLC or in a numeric display object's scaling.

If the register counts down while the vessel empties, keep the goal in view: the picture must read empty at the empty number and full at the full number, so adjust the limits and direction until that is true and retest.

What does a worked example at 0 to 3200 counts look like?

Suppose the PLC logic stores the level as 0 to 3200 counts over empty to full: enter 0 as the meter's low limit and 3200 as its high limit, then expect empty, half and full at 0, 1600 and 3200 counts.

Draw the example meter image 240 pixels tall. One percent of span is 3200 ÷ 100 = 32 counts, and one count moves the fill 240 ÷ 3200 = 0.075 pixels, so each percent steps the liquid 32 × 0.075 = 2.4 pixels. At the mid value the math runs 1600 ÷ 3200 × 100 = 50% full, and the object draws the liquid 1600 × 0.075 = 120 pixels up the 240-pixel rectangle, exactly half. A quarter tank works the same way: 800 ÷ 3200 × 100 = 25%.

The 0 to 3200 span here is an example; take the real span from the PLC logic, and the same arithmetic runs with any low and high pair. Write the three expected pairs on the commissioning sheet before you touch the runtime.

How do you test the fill before release?

Force or wait for the three values from your worked example, low, mid-span and high, and confirm the fill reads empty, half and full with the tank outline pixel-still at every step.

Run the test under a controlled commissioning condition or with safe values: forcing a live level register can move a pump, valve or heater that reads the same address.

Watch one real value change as well: the liquid should track the register without flicker or stale frames while it counts. When the picture disagrees with the register, check three things in order: the live register value in the PLC, the meter's low and high limits, then the artwork. That order separates a logic scaling problem from an object configuration problem and from a drawing problem.

Put a numeric readout beside the tank for commissioning and for operators who need the number; the graphic shows the direction of change and the number shows the value, and the decimal flow values on a numeric display article covers the scaling for it. When the level must call an alarm, set the bit in the PLC and light it from there; the bar graph target line with the alarm in the PLC article pairs that with a target line on the graphic.

Record the three register values against the displayed fill in the commissioning sheet, then release.

When should the fill swap images instead of a moving column?

Use image-by-value swapping when the fill should step between distinct states, for example bottle filling or batch stages: a graphic list swaps whole pictures at value thresholds, and the bar meter suits a level that moves as one column.

A state picture reads faster from across the floor than a thin column, and it matches processes that jump between stages. If you need both, keep the bar meter for level and add a separate state indicator driven by a stage bit. The bottle fill animation with graphic lists page walks through the image-per-state build.

An HMI graphic mirrors one register. When the same floor also needs a screen that plays its own safety notices or shift targets offline, that is a signage job, and our shop-floor displays are built for it.

Recommendation: Build the fill as one bar meter object with the tank artwork in the Background image field and the liquid in the Meter image field, enter the register's true low and high limits from the PLC logic, and release only after the screen agrees with the register at low, mid-span and high. Choose the image-swap route only when the fill should step between distinct states.

Questions

Why should the low-level alarm come from the PLC and not the screen?

The bar meter only mirrors the register across the communications link, and when updates stop it holds the last value on screen, so a frozen fill can look like a steady tank. An alarm bit inside the control program keeps evaluating the level on its own, drives stack lights as well as screens, and needs no editor object to run. Draw the picture for people; let the logic raise the alarm.

Does the meter work if the register already stores percent?

Yes, with the low limit at 0 and the high limit at 100. The trade is resolution: a percent word steps in whole percent, which is 2.4 pixels per step on the 240-pixel example image, while a raw-count register gives 32 steps per percent and a visibly smoother fill. Use the percent word when the logic offers nothing else; take raw counts when both exist.

Why does the fill reach full before the tank is physically full?

The meter tracks the register, and the register tracks the transmitter's span. If the transmitter is spanned for a taller vessel, or the tank's usable volume ends below the transmitter's full scale, the screen reads full while liquid still rises. Check the transmitter's range in the loop documentation, decide whether the screen should show percent of span or percent of usable volume, and set the limits so the picture matches the usable volume.

Does the fill height equal the volume in the tank?

Only in a straight-walled vessel. The object maps the register linearly across the image height, so percent of span equals percent of height. In a vessel with a down-pointing cone, the first half of the height holds well under half the volume, so a half-full graphic can mean a nearly empty vessel. If operators read the graphic as volume, calculate volume in the PLC and drive the meter from a volume register.

Planning information, not legal or engineering advice. Rules differ by place: check codes and permits with your local authority and your licensed trades.

Keep reading

Build your signAsk for a quote