如何在Python中实现无限向下展示图形化信息？

需求回顾 #

示例效果 #

核心需求 #

• 按指定坐标展示多行方块及不同颜色的各类形状
• 鼠标悬停时显示图形化、不可选中的工具提示，所有元素完全图形化呈现
• 支持无限添加新行，需自带滚动条
• 点击图形元素可动态更新其颜色和大小
• 用于观察饮食、睡眠不足对健康影响的长期规律

当前遇到的问题 #

• Matplotlib仅支持固定尺寸界面，无法实现无限滚动
• 认为PyQt Widgets不具备所需功能
• 觉得HTML+JavaScript方案中Python导出数据再用JS解析的流程太繁琐

这个纯Python方案完全满足所有需求，无需依赖其他技术栈：

核心组件说明 #

• QGraphicsScene：作为无尺寸限制的画布，可无限添加各类图形元素（矩形、椭圆等）
• QGraphicsView：作为视图容器，自动提供滚动条，支持无限滚动浏览内容
• 自定义图形项：继承QGraphicsItem，实现悬停提示、点击交互等自定义行为

关键代码实现 #

1. 基础框架搭建 #

from PyQt6.QtWidgets import QApplication, QMainWindow, QGraphicsView, QGraphicsScene
from PyQt6.QtGui import QBrush, QColor, QPen
from PyQt6.QtCore import Qt
import sys

class HealthVisualizer(QMainWindow):
    def __init__(self):
        super().__init__()
        # 创建画布和视图
        self.scene = QGraphicsScene()
        self.view = QGraphicsView(self.scene)
        self.setCentralWidget(self.view)
        self.setWindowTitle("健康数据可视化")
        self.resize(800, 600)
        
        # 初始化示例元素
        self.add_shape(50, 50, 40, 40, QColor(255, 0, 0), "高糖饮食")
        self.add_shape(100, 50, 40, 40, QColor(0, 255, 0), "充足睡眠")

2. 自定义可交互图形项 #

class HealthItem(QGraphicsRectItem):
    def __init__(self, x, y, w, h, color, tooltip_text):
        super().__init__(x, y, w, h)
        self.setBrush(QBrush(color))
        self.setPen(QPen(Qt.PenStyle.NoPen))
        self.tooltip_text = tooltip_text
        self.tooltip = None
        
        # 启用悬停和点击事件
        self.setAcceptHoverEvents(True)
        self.setFlag(QGraphicsRectItem.GraphicsItemFlag.ItemIsSelectable)

    def hoverEnterEvent(self, event):
        # 创建图形化、不可选中的工具提示
        self.tooltip = QGraphicsTextItem(self.tooltip_text, self)
        self.tooltip.setDefaultTextColor(QColor(255, 255, 255))
        self.tooltip.setPos(self.rect().width() + 5, 0)
        self.tooltip.setTextInteractionFlags(Qt.TextInteractionFlag.NoTextInteraction)
        # 添加半透明背景
        tooltip_bg = QGraphicsRectItem(self.tooltip.boundingRect(), self.tooltip)
        tooltip_bg.setBrush(QBrush(QColor(0, 0, 0, 200)))
        tooltip_bg.setZValue(-1)

    def hoverLeaveEvent(self, event):
        if self.tooltip:
            self.scene().removeItem(self.tooltip)
            self.tooltip = None

    def mousePressEvent(self, event):
        # 点击切换颜色示例，可扩展为修改大小等操作
        current_color = self.brush().color()
        new_color = QColor(0, 0, 255) if current_color != QColor(0, 0, 255) else QColor(255, 0, 0)
        self.setBrush(QBrush(new_color))
        super().mousePressEvent(event)

3. 添加动态元素的方法 #

# 在HealthVisualizer类中添加该方法
def add_shape(self, x, y, w, h, color, tooltip):
    item = HealthItem(x, y, w, h, color, tooltip)
    self.scene.addItem(item)

4. 运行程序 #

if __name__ == "__main__":
    app = QApplication(sys.argv)
    window = HealthVisualizer()
    window.show()
    
    # 模拟动态添加多行列数据
    for row_idx in range(1, 20):
        y_pos = 50 + row_idx * 60
        window.add_shape(50, y_pos, 40, 40, QColor(255, 165, 0), f"睡眠不足 {row_idx} 天")
        window.add_shape(100, y_pos, 40, 40, QColor(128, 0, 128), f"高脂饮食 {row_idx} 天")
    
    sys.exit(app.exec())

方案优势 #

• 纯Python实现，无需导出数据到其他技术栈
• QGraphicsView自动提供滚动条，支持无限添加新行元素
• 自定义图形项可灵活实现悬停提示、点击交互（颜色/大小更新）
• 支持任意形状和自定义坐标布局，完全匹配需求

内容的提问来源于stack exchange，提问作者Nav