数据可视化 第6章

第6章 在图表视图中绘制数据

1.修改chart_widget.py，添加add_series函数

from PySide2.QtGui import QPainter
from PySide2.QtWidgets import (QWidget, QHeaderView, QHBoxLayout, QTableView, QSizePolicy)
from PySide2.QtCharts import QtCharts
from PySide2.QtCore import QDateTime

from table_model import *

class Widget(QWidget):
    def __init__(self, data):
        QWidget.__init__(self)

        #获取model
        self.model = CustomTableModel(data)

        #创建QTableView
        self.table_view = QTableView()
        self.table_view.setModel(self.model)

        #QTableView 表头自适应以及拉伸
        self.horizontal_header = self.table_view.horizontalHeader()
        self.vertical_header = self.table_view.verticalHeader()
        self.horizontal_header.setSectionResizeMode(QHeaderView.ResizeToContents)
        self.vertical_header.setSectionResizeMode(QHeaderView.ResizeToContents)
        self.horizontal_header.setStretchLastSection(True)

        # 创建 QChart
        self.chart = QtCharts.QChart()
        # 设置全动画模式
        self.chart.setAnimationOptions(QtCharts.QChart.AllAnimations)
        self.add_series("震级", [0, 1])

        # 创建 QChartView
        self.chart_view = QtCharts.QChartView(self.chart)
        # 设置抗锯齿
        self.chart_view.setRenderHint(QPainter.Antialiasing)

        # 窗口布局
        self.main_layout = QHBoxLayout()
        size = QSizePolicy(QSizePolicy.Preferred, QSizePolicy.Preferred)

        ## 左侧布局
        size.setHorizontalStretch(1)
        self.table_view.setSizePolicy(size)
        self.main_layout.addWidget(self.table_view)

        ## 右侧布局
        size.setHorizontalStretch(4)
        self.chart_view.setSizePolicy(size)
        self.main_layout.addWidget(self.chart_view)

        # 窗口添加布局
        self.setLayout(self.main_layout)

    def add_series(self, name, columns):
        # 创建QLineSeries
        self.series = QtCharts.QLineSeries()
        self.series.setName(name)

        # 将数据放入序列
        for i in range(self.model.rowCount()):
            t = self.model.index(i, 0).data()   #QVariant
            date_fmt = "yyyy-MM-dd HH:mm:ss.zzz"

            x = QDateTime().fromString(t, date_fmt).toSecsSinceEpoch()
            y = float(self.model.index(i, 1).data())
            print (i, y)

            if x > 0 and y > 0:
                self.series.append(x, y)

        # 添加序列
        self.chart.addSeries(self.series)

        # 设置x轴
        self.axis_x = QtCharts.QDateTimeAxis()
        self.axis_x.setTickCount(10)    # 设置要计数的轴上的刻度线数
        self.axis_x.setFormat("dd.MM (h:mm)")
        self.axis_x.setTitleText("日期")
        #
        self.chart.addAxis(self.axis_x, Qt.AlignBottom)
        self.series.attachAxis(self.axis_x)

        # 设置y轴
        self.axis_y = QtCharts.QValueAxis()
        self.axis_y.setTickCount(10)    # 设置要计数的轴上的刻度线数
        self.axis_y.setLabelFormat("%.2f")
        self.axis_y.setTitleText("震级")
        #
        self.chart.addAxis(self.axis_y, Qt.AlignLeft)
        self.series.attachAxis(self.axis_y)

        # 从QChart获取颜色以在QTableView上使用它,然而并没有使用
        self.model.color = "{}".format(self.series.pen().color().name())

2.运行效果，仔细观察，数据是倒着绘制的，即第一条数据在右侧，最后一条数据在左侧