功能介绍: 利用拓扑图实现:64条通道,根据每条通道是否承载业务,提供百分比展示 首先上图,功能效果如图: 废话不多,直接上代码: <!DOCTYPE html> <html> <head> <meta http-equiv="pragma" content="no-cache"> <title>矩形百分比通道组织图核心图</title> <script src="twaver.

功能描述:拓扑图.对节点进行拖拽,序列化获取拓扑图信息,保存到本地localStorage,刷新页面,执行反序列化,从本地获取之前保存的数据,展现之前拖拽后的拓扑 拓展:此处存储用的是web本地存储localStorage;后续嵌入项目时,需存入数据库,通过ajax方式存取 不废话,上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> &l

电信网管系统中,设备状态信息的实时展示非常重要,通常会挂载一堆图标来展示状态或告警信息,图标的信息量有限,有时需要更详细的面板,甚至以图表的形式展现,本文将结合最近客户提到的需求,使用 Qunee1.6 beta版本,实现拓扑图中设备信息的实时显示. Qunee 中ui 的定制非常灵活,每个图元节点都可以挂载多个 ui 控件,支持9X9=81种相对位置,单节点上能挂载多个 ui 元素,并进行排列和布局,另外每个 ui 元素可以绑定图元属性,属性变化,ui 元素会及时更新界面. 网络设备数据流信息

MVVM框架的性能,其实就取决于几个因素: 监控的个数 数据变更检测与绑定的方式 索引的性能 数据的大小 数据的结构 我们要优化Angular项目的性能,也需要从这几个方面入手. 1. 减少监控值的个数 监控值的个数怎么减少呢? 考虑极端情况,在不引入Angular的时候,监控的个数是为0的,每当我们有需要绑定的数据项,就产生了监控值. 我们注意到,Angular里面使用了一种HTML模板语法来做绑定,开发业务项目非常方便,但考虑一下,这种所谓的“模板”,其实与我们常见的那种模板是不同的. 传统

多比图形控件是一款基于Web(VML和SVG技术)的矢量图形控件, 类似于网页上的Visio控件拓扑图软件,是目前国内外最佳的基于web的工作流设计器.工作流流程监视器解决方案. 可广泛应用于包括:电力.军工.煤炭.化工.科研.能源等各种监控软件.web工作流设计器.asp.net工作流设计器.电力.化工.煤炭.工控组态软件.仿真.地理信息系统.工作流.复杂报表 工业SCADA系统.ERP流程设计系统.图形管理.图形拓扑分析.GIS地理信息系统系统.工程制图等领域.目前已经为全球20多个国家的数

Essential Diagram for Windows Forms是一款可扩展的.高性能的.NET平台下的拓扑图控件,可用于开发像Microsoft Visio一样的交互式地绘图和图解应用程序,在节点存储图形对象,支持矢量和光栅图形. 具体功能: 支持多种导出格式:如位图.增强的元文件.SVG文件格式 控件采用清晰的MVC设计,把数据层.表现层和用户层分离 子节点属性可以从父节点继承,开发人员可以应用属性值到一个节点或所有子节点 支持在运行时添加自定义属性 多种线条节点和连接器,支持多种连接

以下网页3D案例均为TWaver原创出品,推荐使用Chrome, FireFox, Safari等对WebGL支持良好的浏览器运行.案例排名不分先后,如需Demo,可直接申请试用.   1. 化学元素周期表 六种排列方式,炫酷动画效果,TWaver 3D轻松实现. 演示地址:http://demo.servasoft.com/chemical-table/ 2.DNA螺旋图 DNA3D模型,包含几千个球体(几十万个面),高性能渲染,搭配丰富色彩和光照效果,可用于医疗三维可视化. 演示地址:htt

对于TWaver可视化家族的成员,大家比较熟悉的是我们的网络拓扑图组件和MONO Design三维建模工具.作为开发工具,这两款产品面向广大的程序猿同志,在界面可视化上为大家省时省力.但是,当项目交付以后,我们经常会遇到这种情况: 在已经交付的某客户现场,甲方又提出了界面改动需求. 通常情况下,需求都不难,但是会超出了当初需求调研以及验收标准中的要求了.而且按照传统的开发流程,撇开时间和费用等问题,界面改动通常需要让后方的美工大人重新调整界面,开发人员进行代码修改,一来一回,耗时耗力.我们近期也

每天坐地铁,经常看地铁图,有一天突然想到,地铁图不也是一种拓扑结果吗?TWaver到底能与地铁图擦出怎样的火花呢?   想到就干,先到网上找幅参考图.各种风格的地铁图还挺多,甚至有大学生自主设计制作,受到地铁相关人士的认可和赞扬.不过看到他花了3周时间,我就比较同情他了,如果学会了TWaver,我保他连3天都不用就可以完成,而且还是纯矢量.可交互.有动态效果.无失真缩放的拓扑图.   我们就以上面这幅地铁图为模版来进行制作. 一.数据整理   俗话说兵马未动粮草先行,没有数据再好的创意也白搭.

这样一簇绚烂丰满艳丽多姿的3D小球花,要多少代码才能完成?其实不足百行,您信吗?下面咱就看一下具体实现过程,让您分分钟学会用TWaver HTML5制作3D拓扑图. 搭建3D空间 首先为花簇的绽放建一个展示的舞台.接触过TWaver2D的都知道,box.network是必不可少的,但对3D场景来说,还远远不够.一是要添加镜头位置,确定我们在什么角度和距离进行观察:二是要加上灯光,否则再美的画面也看不见.灯光分为点光源和环境光,一般来说要一个环境光和若干点光源搭配才能出来好的效果. var box

在日期输入框中添加日历控件,是一种非常流行和实用的做法.临渊羡鱼不如退而写代码,今天就看看在TWaver中是如何实现的.   资源准备   TWaver的在线使用文档中,就有TWaver PropertySheet的demo,直接拿来用就好了.     js的日历控件,网上更是琳琅满目,我相中的是一款“非常好的一个js日历控件”,源码完整,结构清晰,功能齐全,实用好看.     创建Date   首先我们清理精简一下TWaver源代码,再为node通过setClient()创建一个名为Date的

上次文章虽然简单易懂,但很有些小伙伴不满意:你这TWaver和EasyUI结合,只不过生硬地把TWaver图形插进去了,数据和人家EasyUI没一毛钱关系.嘿嘿,不就是想发生关系嘛,没问题啊!咱就还用原来的EasyUI的代码,看看怎么把它表格中的数据用拓扑的方式显示出来. 在本机发布web程序 这次再干咱要有新路,不能再把数据写到代码里了,乱乱乎乎的很不专业,必须原汁原味就用json文件.别小看这一改变,需要在本机搭建服务器,要是原来没接触还真得忙活一阵子.不过这些工作可不白做,那是玩网页开发的

的确,提起TWaver,大家想到的首先是"电信拓扑图组件".事实上.因为其灵活的MVC架构.矢量化设计.方便定制等特点.TWaver能够做的还有非常多.比如房地产行业常见到的"户型图". 户型推荐是销售接待中非常重要的阶段,也被称做是为客户造梦的过程,户型也是客户是否选择该楼盘的一大要素.制作美丽的户型图在房地产行业无疑是非常重要的一项工作. 首先利用TWaver常被忽视的"矢量图形"功能.来定义房间和隔断的形状.这能够通过代码片段完毕.json

最近要画架构图. 一方面有图片洁癖,另外一方面又不想不停的挪动图片. 一开始想用脑图软件. 发现脑图是树状的,架构模块依赖图是网状的.(也可以简化为层级图,不画交互关系.类似 dubbo 的架构图. 外部系统,基础系统,应用层.) 到处搜索有什么可编程的方案. 后面搜索到拓扑图. 简单的布局,画图语言javascript,python很多(变量化),但是有自动布局的组件很少.(graphivz 有自动布局能力,但没有编程功能,变量,for 等缺失.) 1.静态库: 一开始得到的是一些库或者工具:

插播一则广告(长期有效)TWaver需要在武汉招JavaScript工程师若干要求:对前端技术(JavasScript.HTML.CSS),对可视化技术(Canvas.WebGL)有浓厚的兴趣基础不好的可培养,基础好的可共谋大事感兴趣的给我发邮件:hr@servasoft.com ------------------------------------------------------------正文的分割线-------------------------------------------

走到今天,TWaver,一个致力于在技术领域(Technology)的弄潮儿(Waver),已经是第十二个年头.当年网吧的小网管都是IDC机房的运维人员了,TWaver也见证了这个时代的成长变迁. 萌芽于互联网的第一次革命,走过了一波又一波的互联网浪潮,TWaver也从最早一款网络管理可视化的产品(那时候甚至都没有可视化的概念),成长为今天为各行各业定制最前沿的可视化解决方案提供商. 在TWaver历年发布的产品里,一直有一个神秘的存在,他经常化身为各种形式,出现在TWaver的demo.产品和

百度公司的ECharts发展迅速,已经成为HTML5 Chart的佼佼者,这让大家骄傲:中国人终于也有世界级的开源通用UI产品了.正如其网站所说,它是百度的,是中国的,也是世界的.想想那些年,我们追逐感慨过的chart产品,fusionchart.highchart等等不计其数,随着HTML5的迅速普及和ECharts的疯狂发展,大家可以忘掉那些产品了.其他商业chart产品基本上也离颤抖中关门的日子不远了. TWaver各个分支也都有chart模块.虽然它不是核心组件,但是也有和TWaver的

的确,提起TWaver,大家想到的首先是“电信拓扑图组件”.其实,由于其灵活的MVC架构.矢量化设计.方便定制等特点,TWaver可以做的还有很多.例如房地产行业常见到的“户型图”. 户型推荐是销售接待中很重要的阶段,也被称做是为客户造梦的过程,户型也是客户是否选择该楼盘的一大要素.制作漂亮的户型图在房地产行业无疑是非常重要的一项工作. 首先利用TWaver常被忽视的“矢量图形”功能,来定义房间和隔断的形状.这可以通过代码片段完成.json格式定义完成.或编辑器拖拽完成.一小段代码或json足可

jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大多基于jQuery和它的插件.而且现在Angular2的组件生态还不是很完善,我们在编写Angular的时候也许会想要用到jQuery.本篇文章就简单介绍下在Angular2中使用jQuery 如果你不知道怎么搭建Angular2开发环境,请参考我之前写这篇文章:Angular2入门系列教程1-使用

1.AngularJS Seed项目目录结构 AngularJS官方网站提供了一个angular-phonecat项目,另外一个就是Angular-Seed项目.所以大多数团队会基于Angular-Seed项目来开发,本文首先分析angular-seed项目的目录结构.以及AngularJS团队为我们做了什么事情,提供了我们真实开发最需要的框架结构. 这个项目仅仅是一个典型的AngularJS网络应用程序的应用程序骨架. 您可以使用它来快速引导您的Angular webapp项目和搭建开发环境.