鸟类动画定制 [英] Bird Animation customization
问题描述
我正在尝试创建一个网站。该网站的链接是:
I am trying to create a website. The link for the website is:
http:// www .eclectika.org / test3
我想要以下链接中的鸟类:
I want the birds in the following link:
< a href =http://mrdoob.github.io/three.js/examples/canvas_geometry_birds.html =nofollow> http://mrdoob.github.io/three.js/examples/canvas_geometry_birds.html
在我的背景中。请有人建议我的方式。我尝试了很多东西。仍然无法做到正确。
to be in my background. Please someone suggest me the way. I have tried many things. Still cant get it right.
另外请建议一种改变鸟类颜色的方法。
Also please suggest a way to change the color of the birds.
推荐答案
学习three.js会有所帮助。
Learning three.js will defiantly helps.
Renderer
函数刚创建一个新的DOM元素,并在其上绘制场景
。
The Renderer
function just creates a new DOM element and draws the Scene
on it.
因此,实现目标的最简单方法是你设置ui上每个其他元素的 z-index
css属性高于这个Three.js DOM元素。
So the easiest way you can achieve your goal is that you set the z-index
css property of every other element on the ui higher than this Three.js DOM element.
这实际上是如何将统计元素
(显示当前FPS的那个)置于webGL元素之上。
That is infact how the Stats Element
(the one which shows you the current FPS ) is placed on top of the webGL element.
更新1:
如果你看一下 WebGLRenderer ,如果找不到一个画布元素,它会创建一个画布元素。因此,在CSS中,您可以将此元素的z-index属性设置为负数以获得所需结果
If you look at the DOM or the threejs implementation of WebGLRenderer you will find ,it creates a canvas element if it doesn't finds one. so in your CSS you can set the z-index property of this element in negative to achieve your desired result
更新2:
更改材料颜色:
Update 2: Changing material color:
您可以像这样初始化三个颜色的颜色。
you can initialize the color in threejs like this.
var desiredColor= new THREE.Color( 0xff0000 );
或
var desiredColor= new THREE.Color("rgb(255,0,0)");
官方文件这里
然后您只需要删除以下代码行,就可以在材质的颜色属性中设置此颜色来自渲染
函数
then you just need to set this color in the material's color property by just removing the following lines of code from the render
function
color = bird.material.color;
color.r = color.g = color.b = ( 500 - bird.position.z ) / 1000;
并添加这些行。
bird.material.color= desiredColor; // in this case it will change all bird's color to red
这篇关于鸟类动画定制的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!