html5 – 如何绘制3D球体?

前端之家收集整理的这篇文章主要介绍了html5 – 如何绘制3D球体?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在 HTML 5.0画布中画一个3D球或球体.我想了解关于如何绘制3D球体的算法.谁能和我分享一下?

解决方法

更新:此代码相当老旧,有限.现在有三维3D球体库: http://techslides.com/d3-globe-with-canvas-webgl-and-three-js/

十年前,我写了一个Java小程序来渲染一个纹理的球体,通过实际做数学来计算球体表面在场景中的位置(不使用三角形).

我用JavaScript为canvas重写了我已经有一个demo rendering the earth as a sphere

alt text http://sam.haslers.info/render-sphere/JavaScript+Canvas.png

我的机器上有22 fps哪个是基于渲染的Java版本一样快,如果不是更快一点!

现在,我写了Java代码已经很久了 – 而且它是相当钝的 – 所以我真的不记得它是如何工作的,我刚刚移植了JavaScript.然而,这是从缓慢版本的代码,我不知道如果更快的版本是由于Java方法中的优化,我用来操纵像素或加速在数学中,从而制定出哪些像素从质地.我当时也是相应的,有一个类似applet的人比我的速度要快,但是我不知道在JavaScript中是否有可能提升速度,因为它可能依赖于Java库. (我从来没有看过他们的代码,所以我不知道他们是怎么做到的)

所以可能会提高速度.但这是一个很好的概念证明.

如果您有兴趣比较速度,Java版本在这里:

这些是死链接,直到我下一次更新我的网站

> Mine – Instant start,slower to render
> Mine – very slow to start,Much faster render – 此版本也有照明.拖动鼠标旋转轴.
> Someone else’s – 开始更快,渲染速度更快.

我会去转换我的更快的版本一段时间,看看我是否可以改进JavaScript版本的任何速度.

猜你在找的HTML5相关文章