qunee for html5,Qunee for HTML5(一)
1、Qunee for HTML5(以下简称Qunee)是一套基于HTML5技术的图形组件产品,使用HTML5 Canvas技术,绘制清新、流畅的网络图,可用于社交网络图、拓扑图、流程图、地图等需求, JS组件封装,藏繁琐于简洁,轻松构建优雅的互联网应用与企业应用,让数据的在线可视化变得容易。
Qunee - 发音为“kjuːni”,寓意优雅轻巧
2、Qunee可用于拓扑图,流程图,组织图,机房平面图,组态软件的开发,具有轻量、高效、灵活扩展的特点,支持目前主流浏览器(Safari, Firefox, Chrome, IE9+),可运行在不同操作系统(Windows, Mac, Linux......)和移动终端(iOS,Android,Windows Phone......),借助PhoneGap之类的移动开发框架,可以开发移动应用程序。
Qunee提供Web图形解决方案:地图 - 地铁图、统计地图拓扑图 - 社交网络图、网络管理图其他 - 组织图、思维导图、流程图
Qunee组件的特点:
轻巧、高性能 - 支持上万图元,流畅操作矢量图形 - 支持矢量图形,无极缩放交互体验 - 漫游交互,改进交互事件、支持手持设备注重细节 - GIF动画,丰富渐变,层次控制等
3、Qunee主要提供Graph组件,Graph中可以加入不同类型的图元(Node, Edge, Group, ShapeNode, Text, Bus ...),图元可以配置不同的呈现样式,或者挂载或者添加不同的UI元素(LabelUI, ImageUI ...),通过组合和布局,实现丰富的呈现效果,满足多种应用场景:
地图 - 地铁图、统计地图
Qunee提供的丰富矢量图形,对于点线之类数据的展现,能得心应手得解决,可运用于地铁、管线这样的应用Qunee支持漫游交互、无极缩放、不限制坐标范围,这很适合地图的呈现,加上多边形丰富的样式,可用于解决地图背景、以及统计地图之类的问题
拓扑图 - 社交网络图、网络管理图
支持节点、连线、分组等图元类型,具有良好的层次控制,支持上万图形元素,并且流畅操作,带来轻快、高效的视觉体验,适合解决网状数据的呈现与交互问题
其他 - 组织图、思维导图、流程图
借助强大的树形布局器,可以解决树形结构数据的自动布局问题,可运用于组织图、思维导图等提供丰富的基本图形与箭头样式,支持弯曲、正交等连线类型,加上包含关系的控制,可以解决流程图之类的问题
先介绍一个简单的Hello Qunee程序。
Hello Qunee for HTML5
/**
* This file is part of Qunee for HTML5.
* Copyright (c) 2016 by qunee.com
**/
if(!window.getI18NString){getI18NString = function(s){return s;}}
var graph = new Q.Graph(canvas);
var hello = graph.createNode("Hello", -100, -50);
hello.image = Q.Graphs.server;
var qunee = graph.createNode("Qunee", 100, 50);
var edge = graph.createEdge("Hello\nQunee", hello, qunee);
edge.setStyle(Q.Styles.LABEL_OFFSET_Y, -10);
edge.setStyle(Q.Styles.LABEL_POSITION, Q.Position.CENTER_TOP);
edge.setStyle(Q.Styles.LABEL_ANCHOR_POSITION, Q.Position.CENTER_BOTTOM);
edge.setStyle(Q.Styles.LABEL_BORDER, 1);
edge.setStyle(Q.Styles.LABEL_POINTER, true);
edge.setStyle(Q.Styles.LABEL_PADDING, new Q.Insets(2, 5));
edge.setStyle(Q.Styles.LABEL_BACKGROUND_GRADIENT, Q.Gradient.LINEAR_GRADIENT_VERTICAL);
只要懂英文,内容应该是不难理解的,程序创建了一个hello 和Qunee节点,还有一条edge线,后面就是设置edge的样式。运行结果为
Paste_Image.png
qunee for html5,Qunee for HTML5(一)相关推荐
- html5 drag this,HTML5拖放(drag和drog)
拖放(drag和drog)是HTML5的标准的组成部分,也是种常见的特性,意义为抓起一个元素放入到另外的一个位置,在HTML5中任何元素都可以被拖放,前题是要相关进行设置. 1.设置元素为可拖放,也就 ...
- html5在线api,HTML5 历史记录API
HTML5 历史记录API HTML5历史记录API的使用方法,在线实例演示HTML5历史记录API如何使用.浏览器的兼容性.语法定义及它的属性值详细资料等. HTML5历史记录API使您可以通过Ja ...
- HTML5的未来 - HTML5 还能走多远?
日期:2013-1-18 来源:GBin1.com 还记得现在就开始使用HTML5的十大原因吗?HTML5目前仍旧是讨论的焦点,在今天的这篇文章中,我们将讨论HTML5可能的未来. HTML5 的问 ...
- 简单的html5,简单的HTML5初步入门教程
HTML5 代表未来:W3C ( World Wide Web Consortium, 万维网联盟) 已经放弃 XHTML,从而使 HTML5 成为正式标准并得到认可. HTML5 是下一代的 HTM ...
- 【附全部代码+图片】使用HTML5+CSS3绘制HTML5的logo——Web前端系列学习笔记
文章目录 页面展示 技术要点 代码实现 html代码 CSS代码 用到的图片 页面展示 本项目将使用HTML5+CSS3绘制出HTML5的logo,页面效果如下所示. 技术要点 HTML5新特性 HT ...
- html5 绘制图形,HTML5绘制几何图形
绘制几何图形 var canvas = document.getElementById("myCanvas"); var ctx = canvas.getContext(" ...
- php识别html5,CSS_在IE6/7/8下识别html5标签(让老式浏览器识别html5),识别html5标签: html5添加了许 - phpStudy...
在IE6/7/8下识别html5标签(让老式浏览器识别html5) 识别html5标签: html5添加了许多语义化的标签,比如,,什么的,当时看到这些标签的时候心想html5估计很多老式IE浏览器都 ...
- qt webkit 本地html5,Qt Webkit HTML5 Score
This is just to track support of Qt Webkit for HTML5. These are the ratings generating using html5te ...
- html5网页设计教程电子书,HTML5教程(使用HTML5设计网络富客户端应用)
该作品是PDF文件格式请下载 福昕PDF阅读器 新的强大的多媒体和交互功能的HTML5,<HTML5: Designing Rich Internet Applications >包括风格 ...
- html5 audio 资源,HTML5 Audio(音频)
原标题:HTML5 Audio(音频) HTML5 提供了播放音频文件的标准. 互联网上的音频 直到现在,仍然不存在一项旨在网页上播放音频的标准. 今天,大多数音频是通过插件(比如 Flash)来播放 ...
最新文章
- Oracle RMAN 设置和配置(一)
- 简单粗暴tensorflow2.0
- Django使用MySQL笔记
- Eureka集群部署
- bootstrap带有下拉按钮的输入框_关于bootstrap--表单(下拉select、输入框input、文本域textare复选框checkbox和单选按钮radio)...
- php网站无法显示,php – 在UTF-8网站上无法正确显示的字符
- java 路由_RabbitMQ入门:路由(Routing)
- android抽屉风格,Android开发实战之拥有Material Design风格的抽屉式布局
- linux 共享内存_linux进程间通信----IPC篇(一)----共享内存初识篇
- 用sql取a与b的交集_【庖丁解牛SQL(二)】SQL核心语法速查
- 啊哈算法纸牌游戏———小猫钓鱼
- 重复文件清理绿色工具——DoubleKiller
- iOS 结合YYLabel实现文本的展开和收起
- python结巴分词实例_python 结巴分词(jieba)详解
- 1.1、云计算HCIP服务器基础知识
- 八大典型APT攻击过程详解
- 在Ubuntu18.04下 安装MPV视频播放器 的方法
- OpenVZ 简单应用
- C#基础-飞行棋小游戏
- Java课程设计记录——虚拟校园系统
热门文章
- mysql报错无效默认值1067_Mysql 报错:#1067
- vim配置:高亮所在的行和列
- 服务器msdtc没有安全显示项,MSDTC 问题疑难解答 - BizTalk Server | Microsoft Docs
- csol永恒python使用技巧大全_小甲鱼Python第028讲集合:因为懂你,所以永恒 | 课后测试题及参考答案...
- java web学习步骤,javaweb学习路线有哪些?如何学习?
- 福昕阅读器最新注册方法
- EditPlus3.3 集成 SVN
- 介绍常用的无线通信技术
- linux桌面监控软件,Ubuntu安装Conky系统监控桌面插件
- 按键精灵python脚本_Python 假装自己是按键精灵