app.py

data_path = "./data/"

import pandas as pd

# load the csv into motion_capture_data

import streamlit as st
st.title("CyberOrigin Data Visualization")
dataset_option = st.sidebar.selectbox(
    'Select a dataset:',
    ['Fold_towels', 'Pipette', 'Take_the_item', 'Twist_the_tube']
)
motion_capture_path = data_path+dataset_option +"/motionCaptureData.csv"
video_path = data_path+dataset_option+"/video.mp4"
motion_capture_data = pd.read_csv(motion_capture_path)
# create a streamlit app that displays the motion capture data
# and the video data
st.video(video_path)

body_part_names = ['Left Shoulder',
 'Right Upper Arm',
 'Left Lower Leg',
 'Spine1',
 'Right Upper Leg',
 'Spine3',
 'Right Lower Arm',
 'Left Foot',
 'Right Lower Leg',
 'Right Shoulder',
 'Left Hand',
 'Left Upper Leg',
 'Right Foot',
 'Spine',
 'Spine2',
 'Left Lower Arm',
 'Left Toe',
 'Neck',
 'Right Hand',
 'Right Toe',
 'Head',
 'Left Upper Arm',
 'Hips',]

motion_capture_x = motion_capture_data[[body_part_name+"_x" for body_part_name in body_part_names]]
motion_capture_y = motion_capture_data[[body_part_name+"_y" for body_part_name in body_part_names]]
motion_capture_z = motion_capture_data[[body_part_name+"_z" for body_part_name in body_part_names]]

import plotly.graph_objects as go
import numpy as np

# Sample Data Preparation
data = []
times = motion_capture_data["timestamp"]
frames = [go.Frame(
    data=[
        go.Scatter3d(
            x=motion_capture_x.iloc[k],
            y=motion_capture_y.iloc[k],
            z=motion_capture_z.iloc[k],
            mode='markers',
            marker=dict(size=5, color='blue')
        )
    ],
    name=str(k)
) for k in range(len(times))]

# Create the initial scatter plot
initial_scatter = go.Scatter3d(
    x=motion_capture_x.iloc[0],
    y=motion_capture_y.iloc[0],
    z=motion_capture_z.iloc[0],
    mode='markers',
    marker=dict(size=5, color='blue')
)

# Create the layout with slider
layout = go.Layout(
    title='Motion Capture Visualization',
    updatemenus=[{
        'buttons': [
            {
                'args': [None, {'frame': {'duration': 1, 'redraw': True}, 'fromcurrent': True}],
                'label': 'Play',
                'method': 'animate'
            },
            {
                'args': [[None], {'frame': {'duration': 0, 'redraw': True}, 'mode': 'immediate', 'transition': {'duration': 0}}],
                'label': 'Pause',
                'method': 'animate'
            }
        ],
        'direction': 'left',
        'pad': {'r': 10, 't': 87},
        'showactive': True,
        'type': 'buttons',
        'x': 0.1,
        'xanchor': 'right',
        'y': 0,
        'yanchor': 'top'
    }],
    sliders=[{
        'active': 0,
        'steps': [{
            'label': str(k),
            'method': 'animate',
            'args': [
                [str(k)],
                {'mode': 'immediate', 'frame': {'duration': 300, 'redraw': True}, 'transition': {'duration': len(times)/30}}
            ]
        } for k in range(len(times))],
        'currentvalue': {
            'prefix': 'Time: ',
            'visible': True,
            'xanchor': 'right'
        },
        'pad': {'b': 10},
        'len': 0.9,
        'x': 0.1,
        'y': 0,
    }]
)

# Create the figure
fig = go.Figure(data=[initial_scatter], frames=frames, layout=layout)

# Display the figure in the streamlit app
st.plotly_chart(fig)