05 2017 档案
摘要：1.Table在各个浏览器呈现有哪些兼容问题？ 1）如果td的值为空，IE8以下的浏览器会出现边框丢失的状况；可设置单元格内容为空白“ ”，也可设置样式border-collpase:collapse解决。 2）table宽度为100%，在IE8以上以及FF、Chrome浏览器都正常工作，但IE6、IE7，表格始终会出现水平滚动条。 2.用五种方式呈现一个三角形？ ...
阅读全文
摘要：1.使用requestAnimationFrame()来驱动动画 从前，Web应用使用定时器（timer）来控制页面内容动画，通过setTimeout()或setInterval()这两个函数。随着Web 应用开始包含更复杂的动画和交互，这种方式明显遭遇到一些关键问题。 1）.定时器也设置好的恒定间隔来调用函数，无论是否是绘制图形的最佳时机。 2).在定时器回调中执行的Ja...
阅读全文
摘要：WebGL可以用来做3D效果的全景图呈现，例如故宫的全景图。但有时候我们不仅仅只是呈现全景图，还需要增加互动。故宫里边可以又分了很多区域，例如外朝中路、外朝西路、外朝东路等等。我们需要在3D图上做一些标记表示某个小的区域。当点击这个标记时，界面切换到对应标记区域的全景图。下图是实现此功能的一个小DE
阅读全文
摘要：我们要实现的功能比较简单：首先通过坐标定位、我的位置、地址搜索等方式，调用google map api获取地址信息。然后根据地址信息中的全景信息获取当前缩放级别的全景信息。最终把这些全景信息通过WebGL方法显示在屏幕上。 了解了Google街景图的呈现原理，像国内的街景呈现，景区全景呈现不外乎都是
阅读全文
摘要：threex.domevents是一个three.js的扩展库，支持3D场景的交互。和我们操作DOM树的事件相似，名称都是一样的。所以使用起来非常方便。另外他也提供了连接操作。单击网格可实现跳转功能。 如果仅仅使用Dom事件，需要引入： 如果需要使用链接跳转，还需要引入： 不管是使用事件还是跳转，都得创建DomEvents对象： var domEvents =...
阅读全文
摘要：1.Styled Layer Descriptor 标准描述了稳当的结构合使用规则。一个文档包含了符号定义和绘制规则，那么这个文档就叫做Styled Layer Desciptor(SLD)样式，它是一个text/Xml文件，扩展名为.sld。SLD基于XML标记语言，附加的标准是一个XSD sch
阅读全文
摘要：在本篇随笔中，我们学习下什么是对象选择，投影和反投影是如何工作的，怎样使用Three.js构建可使用鼠标和对象交互的应用。例如当鼠标移到对象，对象变成红色，鼠标移走，对象又恢复原来的颜色。 本篇随笔的源代码来自于：https://github.com/sole/three.js-tutorials/tree/master/object_picking 这里还有更多的例子可供...
阅读全文
摘要：1.设置后期处理 设置Three.js库为后期处理做准备，我们需要通过以下步骤对当前的配置进行修改： 1）创建一个EffectComposer（效果组合器）对象，然后在该对象上添加后期处理通道。 2）配置该对象，使它可以渲染我们的场景，并应用额外的后期处理步骤。 3）在render循环中，使用Eff
阅读全文
摘要：1.创建可用Physijs的基本Three.js场景 创建一个可用Physijs的Three.js场景非常简单，只要几个步骤即可。首先我们要包含正确的文件， 需要引入physi.js文件。实际模拟物理场景时非常耗费CPU的，如果我么能在render线程中做的话，场景的帧频会受到严重的影响。为了弥补这
阅读全文
摘要：UV映射是一个用来2D图片纹理转换3D网格的标准技术。U和V表示平面坐标的两个轴，对应了3D空间中X、Y和Z。Blender手册是这样解释UV映射的：想象一个3D模型对象，例如一个球体，平铺到桌面上。每个3D的坐标都会在平面上有一个2D坐标对应。Blender提供了另外一种界面“UV/Image E
阅读全文
