app.py

# import streamlit as st
# import json

# with open("qwen2vl_50.json", "r") as file:
#     qwen_data = json.load(file)
# with open("gpt4o_50.json", "r") as file:
#     gpt_data = json.load(file)

# st.title("JSON Data Visualization")

# columns_per_row = 4
# columns = st.columns(columns_per_row)

# for idx, (qwen, gpt) in enumerate(zip(qwen_data, gpt_data)):
#     image_name, image_url, description, qwen_category = qwen
#     _, _, _, gpt_category = gpt

#     col = columns[idx % columns_per_row]  # 按列循环分配
#     with col:
#         st.subheader(f"{image_name}")
#         st.image(image_url, caption=description, use_column_width=True)
#         st.markdown(f"**Description:** {description}")
#         st.markdown(f"**Qwen_Category:** {qwen_category}")
#         st.markdown(f"**GPT_Category:** {gpt_category}")
#         st.markdown("---")

import streamlit as st
import json

# 加载数据
with open("qwen2vl_50.json", "r") as file:
    qwen_data = json.load(file)
with open("gpt4o_50.json", "r") as file:
    gpt_data = json.load(file)

st.title("JSON Data Visualization")

columns_per_row = 4
columns = st.columns(columns_per_row)

# 用于存储每列的内容高度
heights = [0] * columns_per_row
content_list = [[] for _ in range(columns_per_row)]  # 每列内容占位

# 遍历数据并将内容分配到列
for idx, (qwen, gpt) in enumerate(zip(qwen_data, gpt_data)):
    image_name, image_url, description, qwen_category = qwen
    _, _, _, gpt_category = gpt

    # 将内容添加到对应列的内容列表中
    col_idx = idx % columns_per_row
    content = f"""
    ### {image_name}
    ![]({image_url})
    **Description:** {description}  
    **Qwen_Category:** {qwen_category}  
    **GPT_Category:** {gpt_category}  
    ---
    """
    content_list[col_idx].append(content)

# 渲染每列内容
for col_idx, col_content in enumerate(content_list):
    with columns[col_idx]:
        for item in col_content:
            st.markdown(item)