Simple example drawing a sine curve and a line with Qt Charts.

SineCurve.pro

@@ -0,0 +1,35 @@
+#-------------------------------------------------
+#
+# Project created by QtCreator 2018-04-19T23:02:45
+#
+#-------------------------------------------------
+
+# 记得加上 charts 模块
+QT       += core gui charts
+
+greaterThan(QT_MAJOR_VERSION, 4): QT += widgets
+
+TARGET = SineCurve
+TEMPLATE = app
+
+# The following define makes your compiler emit warnings if you use
+# any feature of Qt which has been marked as deprecated (the exact warnings
+# depend on your compiler). Please consult the documentation of the
+# deprecated API in order to know how to port your code away from it.
+DEFINES += QT_DEPRECATED_WARNINGS
+
+# You can also make your code fail to compile if you use deprecated APIs.
+# In order to do so, uncomment the following line.
+# You can also select to disable deprecated APIs only up to a certain version of Qt.
+#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0
+
+
+SOURCES += \
+        main.cpp \
+        mainwindow.cpp
+
+HEADERS += \
+        mainwindow.h
+
+FORMS += \
+        mainwindow.ui

main.cpp

@@ -0,0 +1,11 @@
+#include "mainwindow.h"
+#include <QApplication>
+
+int main(int argc, char *argv[])
+{
+    QApplication a(argc, argv);
+    MainWindow w;
+    w.show();
+
+    return a.exec();
+}

mainwindow.cpp

@@ -0,0 +1,77 @@
+#include "mainwindow.h"
+#include "ui_mainwindow.h"
+
+MainWindow::MainWindow(QWidget *parent) :
+    QMainWindow(parent),
+    ui(new Ui::MainWindow)
+{
+    ui->setupUi(this);
+}
+
+MainWindow::~MainWindow()
+{
+    delete ui;
+}
+
+void MainWindow::on_actionDraw_triggered()
+{
+    // 用于绘制 spline chart 的数据
+    QSplineSeries *sp = new QSplineSeries();
+
+    // 添加数据到 sp 中，这里取 y = sin(x), -pi < x < pi
+    for (double x = -M_PI; x < M_PI; x += 0.01) {
+        sp->append(x, sin(x));
+    }
+
+    // 用于绘制 line chart 的数据
+    QLineSeries *line = new QLineSeries();
+    // 添加数据 line 中，这里取 y = x^2 - 1, -3 < x < 3
+    // 这里取步长为 0.5，这样可以方便看出来 line chart 和 spline chart 的区别
+    for(double x = -3; x < 3; x += 0.5)
+    {
+        line->append(x, x*x - 1);
+    }
+
+    // 设置名称，会在图例中显示
+    sp->setName(tr("y = sin(x)"));
+    line->setName(tr("y = x^2 - 1"));
+    // 使用 openGL 渲染，可以提速，但是对于这个简单的例子是没有什么区别的
+    sp->setUseOpenGL(true);
+
+    // QChart 类用于管理图表中各种元素，包括坐标点，风格，坐标轴和图例等，这个用于笛卡尔坐标
+    // 另外有 QPolarChart 用于极坐标
+    QChart *chart = new QChart();
+
+    // 将 series 添加到图表中，可以添加多个
+    chart->addSeries(sp);
+    chart->addSeries(line);
+
+    // 绘制默认的坐标轴
+    chart->createDefaultAxes();
+
+    // 设置图表的标题
+    chart->setTitle(tr("简单的 Qt Charts 例子"));
+
+    // 设置 x 轴的范围
+    chart->axisX()->setRange(-4, 4);
+    // 设置 y 轴的范围
+    chart->axisY()->setRange(-1.2, 1.2);
+
+    // 设置图表的主题，取值为枚举 QChart::ChartTheme
+    chart->setTheme(QChart::ChartThemeBlueIcy);
+
+    // 设置动画效果，取值为枚举 QChart::AnimationOption
+    chart->setAnimationOptions(QChart::AllAnimations);
+    chart->legend()->setAlignment(Qt::AlignBottom);
+    //chart->legend()->setVisible(true);
+
+    // QChartView 是一个独立的 Qt widget，用来显示 QChart 的．
+    // 这里 chartView 是界面里的一个 widget，它是从 Qt Widget 提升为 QChartView 得到的
+    // Qt Creator 并没有单独的一个 widget 叫做 QChartView
+    // **关键** 这里要用 setChart 方法将 chart 作为显示的图表
+    // 这一句是将界面中的 QChartView 跟 QChart 联系起来的关键
+    ui->chartView->setChart(chart);
+
+    // 打开抗锯齿，提升显示效果
+    ui->chartView->setRenderHint(QPainter::Antialiasing);
+}

mainwindow.h

@@ -0,0 +1,32 @@
+#ifndef MAINWINDOW_H
+#define MAINWINDOW_H
+
+#include <QMainWindow>
+// 包含 QtCharts，ui 文件是不能直接编辑的，ui 文件生成的代码会用到 QtCharts
+// 而 mainwindow 对应的 ui 文件生成的代码会包含头文件 mainwindow.h
+// 因此可以将 QtCharts 的头文件包含写在这里
+#include <QtCharts>
+// 下面两句是等价的
+// using namespace QtCharts
+QT_CHARTS_USE_NAMESPACE
+
+namespace Ui {
+class MainWindow;
+}
+
+class MainWindow : public QMainWindow
+{
+    Q_OBJECT
+
+public:
+    explicit MainWindow(QWidget *parent = 0);
+    ~MainWindow();
+
+private slots:
+    void on_actionDraw_triggered();
+
+private:
+    Ui::MainWindow *ui;
+};
+
+#endif // MAINWINDOW_H

mainwindow.ui

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<ui version="4.0">
+ <class>MainWindow</class>
+ <widget class="QMainWindow" name="MainWindow">
+  <property name="geometry">
+   <rect>
+    <x>0</x>
+    <y>0</y>
+    <width>400</width>
+    <height>300</height>
+   </rect>
+  </property>
+  <property name="windowTitle">
+   <string>MainWindow</string>
+  </property>
+  <widget class="QWidget" name="centralWidget">
+   <layout class="QVBoxLayout" name="verticalLayout">
+    <item>
+     <widget class="QChartView" name="chartView" native="true"/>
+    </item>
+   </layout>
+  </widget>
+  <widget class="QMenuBar" name="menuBar">
+   <property name="geometry">
+    <rect>
+     <x>0</x>
+     <y>0</y>
+     <width>400</width>
+     <height>29</height>
+    </rect>
+   </property>
+   <widget class="QMenu" name="menu_File">
+    <property name="title">
+     <string>&amp;File</string>
+    </property>
+    <addaction name="actionDraw"/>
+   </widget>
+   <addaction name="menu_File"/>
+  </widget>
+  <widget class="QToolBar" name="mainToolBar">
+   <attribute name="toolBarArea">
+    <enum>TopToolBarArea</enum>
+   </attribute>
+   <attribute name="toolBarBreak">
+    <bool>false</bool>
+   </attribute>
+  </widget>
+  <widget class="QStatusBar" name="statusBar"/>
+  <action name="actionDraw">
+   <property name="text">
+    <string>Draw</string>
+   </property>
+  </action>
+ </widget>
+ <layoutdefault spacing="6" margin="11"/>
+ <customwidgets>
+  <customwidget>
+   <class>QChartView</class>
+   <extends>QWidget</extends>
+   <header>QtCharts/QChartView</header>
+   <container>1</container>
+  </customwidget>
+ </customwidgets>
+ <resources/>
+ <connections/>
+</ui>