Qt开源作品5-仪表盘交互
一、前言
Echart是百度研发团队开发的一款报表视图JS插件，功能十分强大，是本人用过的国产作品中最牛逼的，记得四五年前就在qt中使用过，当时用的浏览器控件是webkit，由于5.6以后的版本不再支持webkit，而换用webengine内核，很多人在下载使用后不能正常编译，今天特意抽空做个webengine版本，使得同时支持webkit和webengine。
在webkit中执行JS用的是webView->page()->mainFrame()->evaluateJavaScript(js);
而webengine用的是webView->page()->runJavaScript(js);
在执行效率上，webengine甩webkit好几条街，在拖动滑块动态设置值的时候，webengine的CPU占用只有1%，而webkit居然达到了7%，恐怖！怪不得webkit逐渐被qt抛弃了，webengine只是内存使用上增加了些。
二、代码思路
第一步：准备网页文件
```c++
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<script src="echarts.min.js"></script>
</head>
<body>
<div id="main" style="height:300px;"></div>
</body>
</html>
第二步：准备JS函数
function setGaugeValue(value){
var option = {
tooltip : {
formatter: "{a} <br/>{b} : {c}%"
},
toolbox: {
feature: {
restore: {},
saveAsImage: {}
}
},
series: [
{
name: '业务指标',
type: 'gauge',
detail: {formatter:'{value}%'},
data: [{value: value, name: '完成率'}]
}
]
};
第三步：数据交互
void Widget::on_horizontalSlider_valueChanged(int value)
{
QString js = QString("setGaugeValue(%1)").arg(value);
#ifdef webkit
webView->page()->mainFrame()->evaluateJavaScript(js);
#else
webView->page()->runJavaScript(js);
#endif
}
三、效果图
四、开源主页
- 以上作品完整源码下载都在开源主页，会持续不断更新作品数量和质量，欢迎各位关注。
- 本开源项目已经成功升级到V2.0版本，分门别类，图文并茂，保你爽到爆。
- Qt开源武林秘籍开发经验，看完学完，20K起薪，没有找我！
- 国内站点：https://gitee.com/feiyangqingyun/QWidgetDemo
- 国际站点：https://github.com/feiyangqingyun/QWidgetDemo
- 开源秘籍：https://gitee.com/feiyangqingyun/qtkaifajingyan
- 个人主页：https://qtchina.blog.csdn.net/
- 知乎主页：https://www.zhihu.com/people/feiyangqingyun/
Qt开源作品5-仪表盘交互的更多相关文章
- Qt开源作品38-无边框窗体方案（无抖动，支持win、linux、mac等系统，侧边半屏顶部全屏）
一 前言 不知道各位程序员有没有遇到过这样一种困惑,好不容易在开源网站找到了类似的想要的项目代码,结果down下来一编译,我勒个去,几百个错误,根本没法用,熟悉的人还好可以直接阅读代码进行修改(有些只 ...
- Github上的一些高分Qt开源项目【多图】
游戏2D地图编辑器: 著名的TileMap编辑器,做2D游戏开发的一定不会陌生. Go 语言的IDE: Go语言的集成开发环境. Clementine Music Player: 功能很完善且跨平台支 ...
- Qt和JavaScript使用QWebChannel交互一——和Qt内嵌网页交互
Qt和JavaScript使用QWebChannel交互一--和Qt内嵌网页交互 目录 Qt和JavaScript使用QWebChannel交互一--和Qt内嵌网页交互 前言 一.效果 二.实现过程 ...
- 我的第一个开源作品Kiwis2 Mock Server
我的第一个开源作品Kiwis2 Mock Server,目前公测中,欢迎大家提供宝贵意见. 代码:https://github.com/kiwis2/mockserver 主页:https://kiw ...
- vs2008编译QT开源项目三国杀（五篇文章）
请参看 http://tieba.baidu.com/f?kz=1508964881 按照上面的网址教程,下载三国杀源码,swig工具,并下载最新的QT4.8.2 for vs2008.我本机已经安装 ...
- 个人开源作品，即时通讯App支持文本、语音、图片聊天
开源一个即时通讯类App,支持纯文本.语音.地理位置.图片聊天,同时还加入了好友圈功能,支持分享动态和发送图片,支持搜索附近的人,使用的百度地图定位功能:由Bmob后端云提供服务器支持,欢迎喜欢的伙伴 ...
- qt安装必要的库 qt开源安装包下载
yum install mesa-libGL-devel mesa-libGLU-devel #yum install freeglut-devel http://www.qt.io/download ...
- 开源作品ThinkJDBC—一行代码搞定数据库操作
1 简介 ThinkJD,又名ThinkJDBC,一个简洁而强大的开源JDBC操作库.你可以使用Java像ThinkPHP框架的M方法一样,一行代码搞定数据库操作.ThinkJD会自动管理数据库连接, ...
- 适合学习的QT开源项目-SerialTool
https://github.com/Skiars/SerialTool A cross platform Serial-Port/TCP/UDP debugging tool. SerialTool ...
- Qt开源编辑器qsciscintilla的一些用法
首先放一张自己做的软件中的编辑器的效果图 中间红色的框就是放在Qt的tabwidget控件中的qsciscintilla编辑器 先从官网下载qsciscintilla源码,在qtcreater中编译, ...
随机推荐
- .NET 开源餐饮系统支持桌面与Web版
前言 推荐一款优秀的开源免费餐饮系统-蜀味正道,专门针对餐饮行业开发的桌面应用程序,帮助大家提供全面的管理解决方案. 项目介绍 蜀味正道是一款借助 Panuon.UI.Silver控件库开发的餐饮软件 ...
- HTTP常用返回结果状态码
摘编自<图解HTTP> HTTP状态码负责表示客户端 HTTP请求的返回结果.标记服务器端的处理是否正常.通知出现的错误等工作.状态码的职责是当客户端向服务器端发送请求时,描述返回的请求 ...
- SQL Server 数据太多如何优化
大家好,我是 V 哥.讲了很多数据库,有小伙伴说,SQL Server 也讲一讲啊,好吧,V 哥做个听话的门童,今天要聊一聊 SQL Server. 在 SQL Server 中,当数据量增大时,数据 ...
- 基于Java+SpringBoot+Mysql实现的快递柜寄取快递系统功能实现十
一.前言介绍: 1.1 项目摘要 随着电子商务的迅猛发展和城市化进程的加快,快递业务量呈现出爆炸式增长的趋势.传统的快递寄取方式,如人工配送和定点领取,已经无法满足现代社会的快速.便捷需求.这些问题不 ...
- unique：数组去重，返回一个新数组
function unique(arr){ if(!isArrayLink(arr)){ //不是类数组对象 return arr } let result = [] let objarr = [] ...
- 太强了！14.7K star！Windows系统居然还有开源替代版了？！
在操作系统的世界里,Windows 系统一直占据着重要的地位.然而,你可能不知道的是,还有一个拥有 14.7K star 的开源替代版 --ReactOS. 1.ReactOS 介绍 ReactOS ...
- vscode c/c++ 和 MSYS2 环境配置记录
vscode c/c++ 和 MSYS2 环境配置记录 网上的教程有一定错误和过时,这里收集了当前的最优配置. MinGW/MSYS2 安装 MSYS2 是一个类似于Linux的shell环境,可以在 ...
- pnpm 是如何颠覆 npm 和 yarn 的？
今天研究了一下 pnpm 的机制,发现它确实很强大,甚至可以说对 yarn 和 npm 形成了降维打击 . 我们从包管理工具的发展历史,一起看下到底好在哪里? npm2 在 npm 3.0 版本之前, ...
- Hibernate 之Hibernate缓存
1.缓存:缓存是什么,解决什么问题? 位于速度相差较大的两种硬件/软件之间的,用于协调两者数据传输速度差异的结构,均可称之为 Cache(摘自Robbin的<缓存技术浅谈>).目的:让数据 ...
- 如何使用Python编写一个Lisp解释器
原文出处: Peter Norvig 译文出处: jnjc(@jnjcc) 本文有两个目的: 一是讲述实现计算机语言解释器的通用方法,另外一点,着重展示如何使用Python来实现Lisp方言Sch ...