Animate an object around a circle on an HMI screen

Why the demo path looks haphazard

The built-in animation demos place example points by eye, so the object hops from spot to spot with no geometry behind it. A machine graphic needs the opposite: positions that mean something. On an indexing table the meaningful positions are the stations, and stations sit at equal angles. When every point sits on a station and the station tag selects the point, the on-screen movement matches the machine one index at a time.

Drawing the path first also gives you something to check against. The circle is the travel path, the radial lines are the sector boundaries, and the intersections are the only places the object should ever land.

What you need

• Your HMI configuration software, with its drawing tools and its point-to-point position list animation.
• The station count N of the table. Every coordinate and the tag range follow from it.
• One integer tag in the PLC that holds the station number, 0 through N-1.
• The index direction as the operator sees the screen, clockwise or counterclockwise, so the point order matches the machine.
• If the graphic runs with no controller behind it, standalone display animation without PLC logic covers the scripted case. Everything below is the PLC-driven version.

Draw the circle and mark the stations

1. Draw the circle with the drawing tools, sized to the graphic area. Note the center (cx, cy) and the radius R in pixels; the coordinates need both.
2. Draw radial lines from the center to the rim, one per sector boundary, spaced 360° / N apart.
3. Count the intersections of the lines with the rim. That count is your point count, one intersection per station.

Place one animation point per intersection

4. Open the point animation settings for the object and add one position per intersection, in index order, station 0 first, following the machine's index direction as it appears on screen.
5. Compute each position: x = cx + R x cos(θ) and y = cy - R x sin(θ), where θ is the station number times 360° / N. The minus sign on y is there because screen pixel rows count downward.
6. Round each coordinate to a whole pixel, because HMI position fields take integers.
7. Leave rotation unset on the object. The point method keeps the marker upright at every station, which suits a table graphic. An object that must point outward at each pocket is a rotation animation job, covered in the recommendation below.

Example: eight stations on a 15 in HMI screen

Inputs. The machine is an indexing dial with eight pockets, so N = 8 and the station tag runs 0 through 7. The panel is a 15 in HMI. The graphic is built on a circle of radius R = 150 px centered at screen pixel (400, 300). The dial size and the panel come from the machine; the center and radius are example drawing values, so substitute the ones your layout gives.

Rule. The step angle is 360° / N. Station i sits at θ = i x 360° / N, measured from station 0 at the 3 o'clock position, at x = 400 + 150 x cos(θ) and y = 300 - 150 x sin(θ).

Arithmetic. Station 1: θ = 45°, cos 45° = 0.707, so x = 400 + 150 x 0.707 = 400 + 106 = 506 px, and y = 300 - 106 = 194 px. Station 3: θ = 135°, cos 135° = -0.707, so x = 400 - 106 = 294 px, and y = 300 - 106 = 194 px. Station 6: θ = 270°, cos 270° = 0 and sin 270° = -1, so x = 400 px and y = 300 + 150 = 450 px.

The full point list:

Result. Eight points spaced 45° apart, one per pocket, each selected by its tag value. One machine index advances the tag by 1 and steps the object one sector.

Decision. At eight stations the build is eight coordinate pairs and eight tag values, a few minutes of arithmetic. One point per station remains the right build up to 16 stations, where the points sit 22.5° apart. Above 16 stations, drive a rotating pointer from the same tag and carry one animated object instead of a 16-entry position list.

Drive the position from the station tag

8. In the PLC, write the station number to the tag after each index completes, in the order the table moves: 0, 1, 2 through 7, then wrap to 0. The indexer's own control logic runs the table; the tag is the display value the graphic mirrors.
9. If the value only matters while this screen is shown, gate the write on the screen number, the pattern PLC logic that runs only on the current HMI screen lays out.
10. Expect the object to cross the chord between neighboring points. Point animation runs straight from one configured position to the next, so the rim between stations is decoration.

Before the cell runs parts, watch one full cycle in a safe test state and compare the drawn station, the tag value and the machine's real pocket at each step. The graphic mirrors the tag; the indexer's position feedback is what stops the dial in the pocket.

Check it worked

11. Put the raw tag value on the screen next to the animation while you commission, alongside the station sensors if the machine has them. Display PLC I/O bits on one screen shows the layout.
12. In a safe test state, force the tag to each value from 0 through 7 and confirm the object lands on the matching drawn station every time.
13. Run one automatic cycle, including the wrap from 7 back to 0, and confirm the step count equals the machine's index count.
14. Check direction: an index that steps the machine clockwise must step the object clockwise on screen. If it runs mirrored, reverse the order of the point list; the coordinates stay where they are.

Recommendation: Build one point per station for any table of 16 stations or fewer, map the tag values to the points in index order, and write the tag from the PLC after each index completes. Above 16 stations, or whenever the marker must aim outward like a pointer, drive a rotation animation from the same tag and skip the coordinate list.

Questions