The Curve class in threejs a general overview

The curve class in threejs is a way to go about creating a curve with a little javaScript logic when it comes to working directly with the curve base class. There is also a number of built in classes that extend the curve base class which might be the best starting point for this sort of thing actually. However there might end up being a situation now and then where I might want to create my own class that extends the curve base class. Also even if I just work with the built in options that extend the curve base class I still want to have a solid grasp on what there is to work with when it comes to the common methods of curves that can be found in this base curve class.

Read More

Deterministic Lines threejs example

I wanted to make a new threejs example that has to do with creating and mutating a group of lines. As of late I have also been playing around with tube geometry, which requires passing a curve as the first argument when making the geometry.

This example however will just be a project in which I continued with my last threejs example that also had to do with creating a group of lines. However the goal with the older example was just to create a group of lines that form a sphere of sorts, and then mutate things from there. With this example what I wanted to do is make a similar system of sorts, but to make it so that a group of lines that form a sphere is just one of many options. So in other words this is just a general kind of system for a group of lines that can be set into all kinds of various states beyond just that of a sphere like shape.

Read More

Sphere circles Lines threejs example

When it comes to making lines in threejs I wanted to make a threejs example in which I have a collection of lines that form a sphere like shape. So the general idea is to make a JavaScript module that has a create method that will return a group of lines, where each line is one circle that forms something that will look like a sphere when it comes to the over all shape of the collection of lines.

I can then also add a method that can be used to update the state of this group of lines with a new set of options as a way to make various kinds of animations. So there is starting out with the basic idea of what i want to do, and then also maybe make a kind of module form of this example. Once I have a module form of this genera idea I can then make all kinds of additional demos that make use of the module to create, and update the state of the lines.

Read More

Inverting the normals of a sphere threejs example

When editing some of my older threejs content and have got around to my post on cube textures which in turn put me in the direction of exploring this topic and related subjects and also alternatives. The process of just adding a cube texture to a scene is one thing, but the process of creating textures to use as cube texture is a whole other matter. Thus far I have not found a sound way to go about creating these kinds of textures from a resource image because doing so is a little involved, and I have a lot of pots boiling on top of this that makes me want to look for a kind of simple place holder solution for now.

There are a lot of issues that come up when trying to make one of these cube textures, for one thing I need to start with a texture that is seamless in all directions, and on top of that I need to have a way to mutate the state of the texture so that it does not look like I am in inside a cube but rather a sphere of sorts even though it is a cube.

While I look into the subject of making these kinds of textures the thought occurred that there should be more than one way to go about doing this sort of thing that will have the same visual outcome at least. One such idea would be to just have a sphere, and inverting the normal attribute values so that the effect of the rendering of the textures is inverted. Also I might want to change the order of the points in the position attribute, or use the THREE.BackSide constant for the side property of the material.

Then there is making a texture to use with the inner surface of this sphere, and making all of this part of a DAE file that I can then just load, scale up as needed, and have fixed at the center of the scene object. I can then have a situation in which the camera and all additional objects of interest are inside this kind of sky sphere, and I can then just draw on the surface of this sphere as a way to create a kind of background for one or more over all projects.

Although this kind of alternative might have its advantages it is will not at all a replacement for making a cube texture, which does stroke me as the best way to go about doing this sort of thing with threejs projects. One reason why is that cubes textures are not jst use for backgrounds, but environment maps also. Still this kind of alternative might still work okay of I do not care about environment maps for now. So then this a post on a threejs example in which I am using a DAE file of a sphere with inverted normal, and custom uv mapping and textures as an alternative way of making a kind of cube texture.

Read More

Weird Walk Three threejs example

I would like to make another one of my weird walk modules where the goal is to just have fun with the library to make some kind of collection of mesh objects that is just some kind of character or object. The over all end look of the model, if it can be called that, looks like it has legs and is just going threw something that can be thought of as a kind of walk cycle.

I am looking to continue expanding my collection of threejs examples as I think I have hit a bit of a wall when it comes to leaning more about the library itself, for the moment at least. So it would very much seem to be just the thing two do to start thinking in terms of what I would like to do with threejs when it comes to making actually projects rather than just demos of various threejs features.

Read More