博客首页 → WebGL

最新文章列表

基于HTML5的WebGL设计汉诺塔3D游戏

在这里我们将构造一个基于HT for Web的HTML5+JavaScript来实现汉诺塔游戏。 http://hightopo.com/demo/hanoi_20151106/index.html 汉诺塔的游戏规则及递归算法分析请参考http://en.wikipedia.org/wiki/Tower_of_Hanoi。 知道了汉诺塔的规则和算法，现在就开始创建元素。用HT for Web ...
HTML5WebGL3D电信网管Hightopo 
xhload3d 评论(1) 有1389人浏览 2015-11-14 01:01

基于HTML5的WebGL应用内存泄露分析

上篇(http://www.hightopo.com/blog/194.html)我们通过定制了CPU和内存展示界面，体验了HT for Web通过定义矢量实现图形绘制与业务数据的代码解耦及绑定联动，这类案例后续文章还会继续以便大家掌握更多的矢量应用场景，本篇我们先切换个话题，谈谈模型-视图-事件之间的关系。 http://www.hightopo.com/guide/guide/core/be ...
HTML5拓扑图WebGL内存泄露MVVM 
xhload3d 评论(0) 有1478人浏览 2015-10-26 00:46

基于HTML5实现3D热图Heatmap应用

Heatmap热图通过众多数据点信息，汇聚成直观可视化颜色效果，热图已广泛被应用于气象预报、医疗成像、机房温度监控等行业，甚至应用于竞技体育领域的数据分析。 http://www.hightopo.com/guide/guide/plugin/forcelayout/examples/example_heatmap2d.html http://www.hightopo.com/guide/ ...
WebGLHightopo工控heatmap热图 
xhload3d 评论(0) 有904人浏览 2015-10-13 23:35

基于HTML5实现3D监控应用流动效果

http://www.hightopo.com/guide/guide/core/lighting/examples/example_flowing.html  流动效果在3D领域有着广泛的应用场景，如上图中医学领域可通过3D的流动直观的观察人体血液的流动，燃气领域可用于监控管道内流动的液体或气体的流向、流速和温度等指标。   如今企业数据中心机房普遍面临着设备散热的问题，采用冷热通道方 ...
HTML5WebGL3D流动工控 
xhload3d 评论(0) 有1797人浏览 2015-10-11 21:39

基于HTML5的3D网络拓扑树呈现

在HT for Web中2D和3D应用都支持树状结构数据的展示，展现效果各异，2D上的树状结构在展现层级关系明显，但是如果数据量大的话，看起来就没那么直观，找到指定的节点比较困难，而3D上的树状结构在展现上配合HT for Web的弹力布局组件会显得比较直观，一眼望去可以把整个树状结构数据看个大概，但是在弹力布局的作用下，其层次结构看得就不是那么清晰了。所以这时候结构清晰的3D树的需求就来了，那么 ...
HTML5网络拓扑3DWebGLCanvas 
xhload3d 评论(0) 有1466人浏览 2015-10-06 14:36

透过HT for Web 3D看动画Easing函数本质

http://www.hightopo.com/guide/guide/plugin/form/examples/example_easing.html 50年前的这个月诞生了BASIC这门计算机语言，回想起自己喜欢上图形界面这行，还得归功于当年在win98下用QBASIC照葫芦画瓢敲了一段绘制奥运五环的代码，当带色彩的奥运五环呈现在自己面前时我已知道自己这辈子要走的路了。在这个忘本逐新的年代不 ...
WebGL3D拓扑Easinghtml5 
xhload3d 评论(0) 有980人浏览 2015-10-03 00:18

HTML5+WebGL 3D机房开发实例

前阵子写了一篇HMTL5 3D机房开发的例子http://twaver.iteye.com/blog/2215863，介绍了如何用html5在网页上创建无插件的精美3d机房场景，收到很多朋友的鼓励，深 ...
HTML53DwebGL前端开发机房 
TWaverGeek 评论(1) 有11634人浏览 2015-09-30 15:28

基于HT for Web的3D拓扑树的实现

在HT for Web中2D和3D应用都支持树状结构数据的展示，展现效果各异，2D上的树状结构在展现层级关系明显，但是如果数据量大的话，看起来就没那么直观，找到指定的节点比较困难，而3D上的树状结构在展现上配合HT for Web的弹力布局组件会显得比较直观，一眼望去可以把整个树状结构数据看个大概，但是在弹力布局的作用下，其层次结构看得就不是那么清晰了。所以这时候结构清晰的3D树的需求就来了，那么 ...
HTforWebWebGL拓扑图3D 
xhload3d 评论(1) 有1226人浏览 2015-09-09 10:00

HTML5数据可视化第二弹：打造最美3D机房

最近项目开发任务告一段落，刚好有时间整理这大半年的一些成果。使用html5时间还不久，对js的认识还不够深入。没办法，以前一直搞java，对js的一些语言特性和概念一时还转换不过来。   上一篇第一弹介绍了项目中做的一个彩虹爆炸图，主要用了 html5的canvas的2d绘制技术。这一回我想介绍一下项目中的一个亮点技术：html5的3D，以及如何用它打造精美的3D机房监控系统。   目标 ...
HTML5javascript3D机房webGL 
TWaverGeek 评论(2) 有12784人浏览 2015-06-01 14:25

TWaver推智能手表挑战华为苹果

2015年的春节刚过，苹果、华为、三星就紧锣密鼓的发布了各自新产品。华为、苹果的智能手表最吸引眼球。TWaver也不甘示弱，立刻连夜推出了更像传统 ...
华为三星智能手表twaver3dwebgl 
xiaozhonghua 评论(0) 有1568人浏览 2015-03-03 17:19

齐次坐标

最近在学webgl，学了一段时间了，对齐次坐标发表一下自己的见解。 一，首先让我们来认识一下齐次坐标的意义。小二，上图！ 齐次坐标存在的意义，就像分母21的存在一样，使得两个分母不同的分数得以相加或相减。也许你已经想到了，齐次坐标的存在就是为了使不同维度的坐标得以一起参加运算 二，我们来看一下齐次坐标是如何让不同维度的坐标得以参加运算的。小二，上菜           如图，我们要将两个不 ...
webgl齐次坐标 
1036225283 评论(0) 有738人浏览 2015-01-21 21:59

使用Animation实现ThreeJS动画

第一步： 画地面，并让地面旋转，以便观察 效果： 代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Knight</title> <style>body{background:#ff ...
webglthree.js 
18211103738 评论(0) 有17981人浏览 2015-01-21 16:33

WebGL初步

1.概述 WebGL是一项利用JavaScript API呈现3D电脑图形的技术，有别于过往需加装浏览器插件，通过WebGL的技术，只需要编写网页代码即可实现3D图像的展示。WebGL的规格尚在发展中，由非营利的Khronos Group管理。WebGL基于OpenGL ES 2.0，提供了3D图像的程序接口。它使用HTML5 Canvas并允许利用文档对象模型接口。可利用部分Javascript实 ...
webgl 
xpenxpen 评论(0) 有1048人浏览 2015-01-20 11:27

使用MorphAnimMesh实现ThreeJS动画

效果：    代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Morph-Bird</title> <style>body{background:#eeeeee;margin:0;p ...
webglthree.js 
18211103738 评论(0) 有1711人浏览 2015-01-19 22:15

使用MorphAnimation实现ThreeJS动画

效果：   代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Horse</title> <style>body{background:#eee;margin:0;padding:0;o ...
webglthree.js 
18211103738 评论(0) 有3791人浏览 2015-01-19 22:12

通过改变morphTargetInfluences实现物体变形

在three.js中morphTargets允许物体发生变形。如果该物体的geometry有 n 个顶点，那么MorphTargets允许你再指定 n 个， 2n 个， 3n 个甚至更多个顶点（比如，p⋅n 个），同时mesh对象提供一个数组morphTargetInfluences（公式中fj表示morphTargetInfluences[j]），具有 p 个元素，每个元素取值在0-1之间。渲 ...
webglthree.js 
18211103738 评论(0) 有3225人浏览 2015-01-19 21:48

ThreeJS系列教程-Lesson7

效果：  代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Three.js tutorial - Lesson 07</title> <style>body{background:#e ...
three.jswebgl 
18211103738 评论(0) 有717人浏览 2015-01-17 11:55

HT for Web 3D游戏设计设计--汉诺塔（Towers of Hanoi）

在这里我们将构造一个基于HT for Web的HTML5+JavaScript来实现汉诺塔游戏。 汉诺塔的游戏规则及递归算法分析请参考http://en.wikipedia.org/wiki/Tower_of_Hanoi。 知道了汉诺塔的规则和算法，现在就开始创建元素。用HT for Web（http://www.hightopo.com）现有的3D模板创建底盘和3根柱子不是问题，问题是要创建 ...
HTML53D汉诺塔WebGL游戏 
xhload3d 评论(0) 有700人浏览 2015-01-12 19:00

ThreeJS系列教程-Lesson6

效果：  代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Three.js tutorial - Lesson 06</title> <style>body {background: # ...
webglthree.js 
18211103738 评论(0) 有2649人浏览 2015-01-10 16:34

最近博客热门TAG

Java(141747) C(73651) C++(68608) SQL(64571) C#(59609) XML(59133) HTML(59043) JavaScript(54918) .net(54785) Web(54513) 工作(54116) Linux(50906) Oracle(49876) 应用服务器(43288) Spring(40812) 编程(39454) Windows(39381) JSP(37542) MySQL(37268) 数据结构(36423)

博客人气排行榜

    博客电子书下载排行

      >>浏览更多下载

      相关资讯

      相关讨论

      Global site tag (gtag.js) - Google Analytics