QT：Qt与ECharts

news/2024/10/18 8:38:30/

介绍ECharts

ECharts是一款基于JavaScript的数据可视化图表库，由百度团队最初开发，并在2018年初捐赠给Apache基金会，成为ASF孵化级项目。随着项目的不断发展，ECharts在2021年1月26日正式毕业，成为Apache顶级项目
链接：https://echarts.apache.org/zh/index.html

下载

在这里插入图片描述

在这里插入图片描述
先选择自己需要的图形在进行下载

得到文件echarts.min.js

创建项目

工程目录下新建文件夹myecharts

在这里插入图片描述

选择下载实例
在这里插入图片描述

放到文件夹myecharts
在这里插入图片描述
将文件夹myecharts放到编译后的.exe目录下

E:\ljl\pro\qt\240711\ECharts01\build\Desktop_Qt_5_15_2_MinGW_32_bit-Debug\debug\myecharts\line-smooth.html

UI 添加控件一个widget 加三个

widget 提升QWebEngineView
在这里插入图片描述

    QString exe_path = qApp->applicationDirPath();QString _klinePath = exe_path + "/myecharts/line-stack.html";qDebug()<<_klinePath;ui->widget->setUrl(QUrl(_klinePath));

在这里插入图片描述
按键点击切换页面

#include "widget.h"
#include "ui_widget.h"
#include <QDebug>
Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);QString exe_path = qApp->applicationDirPath();QString _klinePath = exe_path + "/myecharts/line-stack.html";qDebug()<<_klinePath;ui->widget->setUrl(QUrl(_klinePath));connect(ui->radioButton_stack, &QRadioButton::toggled, [=](bool checked){if(checked){ui->widget->setUrl(QUrl(_klinePath));}});connect(ui->radioButton_time, &QRadioButton::toggled, [=](bool checked){if(checked){//area-time-axis.htmlQString _timePath = exe_path + "/myecharts/area-time-axis.html";ui->widget->setUrl(QUrl(_timePath));}});connect(ui->radioButton_smooth, &QRadioButton::toggled, [=](bool checked){if(checked){QString _linePath = exe_path + "/myecharts/line-smooth.html";ui->widget->setUrl(QUrl(_linePath));}});}Widget::~Widget()
{delete ui;
}