1

我最近在一个丹麦网站上发现了一个非常酷的 3D 图形。您可以旋转和缩放地球的 3D 对象。我对网站上的 3D 图形很感兴趣，我很好奇这是如何做到的。我确定它不是 Flash，因为我右键单击了它，并且当您右键单击 Flash 图形时，没有关于 Flash 的信息，那么它可能是什么？

链接：链接到丹麦网站 BIG 然后选择Locations

4

4 回答 4

7

您所指的旋转地球实际上是在 HTML Canvas 元素上呈现的 WebGL，并通过 Javascript 进行控制。

WebGL 功能强大，但对于对 OpenGL-ES 编程没有扎实了解的人来说并不容易上手。我建议使用一个库，最好的库是（在我看来）http://threejs.org，它通过为您管理低级 3D 操作来简化任务，让您专注于高级概念（多边形，阴影等）。有很多关于典型“hello world”的教程和示例（幸运的是，它是地球的代表，带有一些交互性）。

深入了解您给出的示例，我建议您查看适合的本教程，并解释如何完成相同的事情：http ://www.smartjava.org/content/render-open-data-3d-world-全球-threejs。

旁注：Three.js 允许在 WebGL、Canvas、SVG 或 CSS3 表面上进行渲染。IE 不支持 WebGL，但 Canvas 支持 (IE9+)。这意味着可以在所有最常见的浏览器上实现相同（或几乎相同）的结果（但性能完全不同）。

于 2013-06-04T06:06:19.610 回答
1

这是通过 HTML 画布标签和 Javascript 完成的。一个很好的教程在这里。

于 2013-06-04T06:00:45.820 回答
0

已使用 Html5、Jquery、Web 字体和少数其他 3rd 方 javascript 的组合...要了解更多信息，您可以使用 chrome web 检查器检查它是如何完成的 https://developers.google.com/chrome- developer-tools/ 或者你可以使用 Firebug- Firefox Addon 来做同样的事情

我不确定这里是否使用了 WebGL，因为我不知道

于 2013-06-04T06:37:04.720 回答
0


您还可以查看 verge3d，它简化了 3D 元素的集成（在 Blender 或 Maya 中制作）并将它们导出为 gltf Web 应用程序，这些应用程序可以使用他们所谓的拼图语言进行编程，这实际上只是拖放脚本块和逻辑连接器。Google Studio Earth 也可以实现。但是，如果您不想进行大量编程，那么易用性将是 verge3d。

看过那个网站后，如果我是一个赌徒（而且我是），我会在 verge3d 中完成的特定实施上投入资金。从加载屏幕到地球的运动如何交互，感觉就像 verge3d。（不能说 100%，但我肯定会花一些钱。）它有一个 WordPress 插件，便于集成，该网站使用 WordPress。网站中使用的元素都属于平台，因此请查看。

Verge3d WordPress 集成

于 2021-05-29T07:27:18.103 回答