导航原理实验系统软件——node-webkit初探
最近,和同学接手了一个某军校《导航原理》课程的教学实验平台软件开发工作。
本项目在客户端主要用到的技术便是node-webkit,使用它能够以Web的方式开发桌面应用程序。下面,就以本项目为例,介绍一下node-webkit项目。
顾名思义,node-webkit就是nodejs+webkit。这样做的好处显而易见,核心奥义在于,用nodejs来进行本地化调用,用webkit来解析和执行HTML+JS。
首先,下载安装node-webkit。点击下面的链接下载解压即可。
https://github.com/rogerwang/node-webkit
下载完之后解压,可以看到如下内容:

双击nw.exe直接运行,看到如下界面说明一切都ok,在你的机器上可以运行:

接着,便可开始本项目的开发工作了。我选择了webstorm作为ide工具,下载安装webstorm,再去网上随便找个破解码(建议花点钱装个B)。
下载安装好webstorm后,新建一个空工程,命名为“daohang”。如下图:

最简单的node-webkit项目只需要两个文件,即:一个html文件和一个package.json(来说明项目名称、版本和依赖等)。而本项目需要制作很多飞机航行位置变化等动画效果,还需要与硬件交互,所以还需要借助css、js、node.js、jquery、johnny-five等。下面,简要介绍一下各个技术。
1、页面样式:css
2、svg动画和特效:html5、css3、jquery、js
3、串口通信:node-serialport(node.js的一个通信模块)、johnny-five(使Arduino板能与网络交互的框架)
目前,本项目的模块只完成了基本页面的跳转,还未开始动画和串口通信的开发。项目结构如下:

最后,我们来看看项目初步运行效果。主页面index.html如下,用户可以选择进入路基或星基系统。

在路基系统中,操作界面如下:

系统主要的功能模块分为:无线测角、测距和测速。这里涉及和硬件交互,需要使用node-serialport、J5等技术与Arduino板进行数据交互,动态地更新页面,目前正在学习中。
今后,会随着项目的进展,和大家分享有关SVG动画制作、J5、node-serialport的相关应用。
导航原理实验系统软件——node-webkit初探的更多相关文章
- Node.js初探之GET方式传输
Node.js初探之GET方式传输 例子:form用GET方法向后台传东西 html文件: <form action="http://localhost:8080/aaa" ...
- Node Express 初探
一如既往,先上一张图 Express 基于 Node.js 平台,快速.开放.极简的 web 开发框架. 关于Express更多相关知识请链接至官网http://www.expressjs.com.c ...
- 编译原理实验之SLR1文法分析
---内容开始--- 这是一份编译原理实验报告,分析表是手动造的,可以作为借鉴. 基于 SLR(1) 分析法的语法制导翻译及中间代码生成程序设计原理与实现1 .理论传授语法制导的基本概念,目标代码结 ...
- Node.js 初探
概念 Node.js 是构建在Chrome javascript runtime之上的平台,能够很容易的构建快速的,可伸缩性的网络应用程序.Node.js使用事件驱动,非阻塞I/O 模式,这使它能够更 ...
- 解密SVM系列(四):SVM非线性分类原理实验
前面几节我们讨论了SVM原理.求解线性分类下SVM的SMO方法.本节将分析SVM处理非线性分类的相关问题. 一般的非线性分类例如以下左所看到的(后面我们将实战以下这种情况): 能够看到在原始空间中你想 ...
- 计算机网络原理实验_使用网络协议分析仪Wireshark
一.实验名称 使用网络协议分析仪Wireshark 二.实验目的: 1. 掌握安装和配置网络协议分析仪Wireshark的方法: 2. 熟悉使用Wireshark工具分析网络协议的基本方法,加深对协 ...
- 堆栈上的舞蹈之释放重引用(UAF) 漏洞原理实验分析
0x01 前言 释放重引用的英文名名称是 Use After Free,也就是著名的 UAF 漏洞的全称.从字面意思可以看出 After Free 就是释放后的内存空间,Use 就是使用的意思,使用释 ...
- ARP协议工作原理实验
一.实验目的 验证"在向目的主机发送数据包时会先查询ARP高速缓存,如果ARP高速缓存中已保存了目的主机的MAC地址,不进行ARP查询,使用ARP高速缓存中的MAC地址:如果缓存中没有IP对 ...
- Node.js系列之node.js初探
官方介绍:Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable n ...
随机推荐
- 字符串处理,NSNumber转换
more:http://www.superqq.com/blog/categories/ioskai-fa/ 1.判断字符串是否为空 if ([text lenght] == 0) { // ...
- [Angular Tutorial] 8 - Templating Links & Images
在这一步中,我们将会在电话列表中为电话添加略图,并附上链接,当然现在也不会链接去哪.在随后的步骤中,我们将使用这些链接来展示电话列表中额外的信息. ·现在电话列表中会有链接和图片. 最重要的不同在下面 ...
- IM 融云 之 列表中显示聊天用户名称
现在发现,聊天列表中,用户名称没有显示出来.
- IM 融云 之 安装cocoapods 安装 SDK
1. podfile 内容如下: platform :ios, '7.0' pod 'RongCloudIMKitWithVoip', '2.4.3' 现在最新是2.4.3 导入之后,就直接可以用了. ...
- yum命令被锁 Existing lock /var/run/yum.pid
有时使用yum命令,不知怎会回事就提示: Existing lock /var/run/yum.pid: another copy is running as... 感觉也没操作什么错误的事情. 此时 ...
- dubbo框架揭秘之服务发布
通常情况下是通过Spring配置的方式去实现服务的发布,为了方便调试,我就不采用Spring配置的方式. DemoService demo = new DemoServiceImpl(); Appli ...
- C标准I/O建立一个文件仓库
实现了 增删改查 创建了一个结构体 保存 num name cout price 代码 #include<stdio.h>#include<string.h>#include& ...
- 7-1 vim 编辑器
1. vi:visual interface. 1. vim:vi improved 这些都属于全屏编辑器,又是模式化编辑器 vim模式(3种) 编辑模式(命令模式) 输入模式 末行模式 模式转换 编 ...
- swift 中使用OC第三方库(以AFNetworking为例)
首先呢 把你需要的第三方库导入到你的项目中来 具体怎么导入 这不是这篇的重点 看上一篇 废话不多 直接上 (1)在项目中直接建一个 oc 的控制器 然后xcode会提醒你 要不要建造桥接文 ...
- 关于ExtJS必输框,多选项
必填项: //页面内传值用ID,和后台联系用name <div class="col-xs-4"> <div class= ...