Geometry.js | Javascript Geometry Class for Games / Etc | Game Engine library
kandi X-RAY | Geometry.js Summary
kandi X-RAY | Geometry.js Summary
Javascript Geometry Class for Games / Etc
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of Geometry.js
Geometry.js Key Features
Geometry.js Examples and Code Snippets
Community Discussions
Trending Discussions on Geometry.js
QUESTION
I'm working on building up quite a complex static render in the browser with three.js and have gotten stuck early in the process trying to produce correct shadows with a single THREE.DirectionalLight representing the sun in my scene. All the geometry (contained in another .js file) has shadows enabled. The green sphere is for debugging purposes and is translated (50,0,50) to the center of the plane to represent the target for the camera and location of DirectionalLight.target. The directional light position and main camera position did set correctly.
My theory on why the shadows aren't working is because the orthogonal camera representing the shadow camera is pointing off in the wrong direction. I failed yesterday to figure out and solve the behaviour of the directional light helper (white line to the origin) and shadow camera helper (right).
I'm assuming the correct orientation, and the orientation I'm aiming for, has the directional light helper and shadow camera helper aligned to the center of the plane. After so much research yesterday, my shadow camera doesn't seem to automatically pick up the light position / light target vector. Why are they still anchored to the origin?
Does anyone have any suggestions about how to fix the DirectionalLight.target in my scene? Why are the DirectionalLightHelper and CameraHelper inconsistent?
ANSWER
Answered 2021-Jan-05 at 16:53directionalLight.shadow.camera = new THREE.OrthographicCamera( -view_n, view_n, view_n, -view_n, 60, 150 );
Please do not overwrite the camera reference of LightShadow.camera. Configure the directional light like so:
QUESTION
I am running iOS 13.7 on an iPhone and all the three.js examples I tried (including the ones on fat lines and orbit controls) work flawlessly on my mobile device.
However, I do not seem to be able to get my own code running on mobile, see the source code and the uploaded website for reference. It works on both Edge and Chrome on my Windows computer.
This answer suggested adding "use strict"; to all .js files, which I did even for the imported modules, but to no avail.
Any ideas or hints on what could be breaking my JavaScript code for mobile?
This how the modules were included in hopf.js:
...ANSWER
Answered 2020-Sep-29 at 21:07Your website isn't running on Firefox either. If you open the console, you'll see the error:
Uncaught SyntaxError: private fields are not currently supported
which is happening on the line that uses #distanceToCenter_radians; because the # symbol is a reserved key to declare a private field. I recommend you remove it to improve browser compatibility. Looking at the support table, private fields don't work on Firefox and any Safari below 14.0
After fixing the Firefox bug, I tested it on Safari, and I ran into this error in the console:
This is because your baseSpaceCircle class uses public class fields, which are not supported by Safari until version 14.0+.
QUESTION
I want to make transforms around a pivot point using webgl. Inspired by Three.js and this comment
Create a object that will act as pivot:
mesh.position.y = 10;
var pivot = new THREE.Object3D(); pivot.add( mesh );
scene.add( pivot );
I am trying to set the pivot to some point and rotate the object. Here's my code to do these:
...ANSWER
Answered 2019-Sep-07 at 01:51A scene graph is just a way to represent a hierarchy of matrices. Here's a simple human scene graph
QUESTION
Okay, hello. I'm just getting into threejs. I am currently developing a kind of block game (compare Minecraft).
I decided not to base the whole program on objects, but on planes. (per PlaneGeometry class)
Since I've almost finished writing my renderer, I want to use different blocks with different textures - like in minecraft - because so far the texture is the same for each block.
How can I use different THREE.Mesh textures with one Geometry object?
Is that even possible - and does anyone have any idea how I can do that?
I have published parts of my code below:
...ANSWER
Answered 2019-Jul-14 at 09:23I'm not sure I understand your question correctly but a geometry object has no dependency to a material. So you can reuse a single geometry for different meshes and apply different materials to it. Each material can of course refer to different textures. Simple code example:
QUESTION
I am trying to show the vertices on selected features in openlayers 3 by customizing their style. I have managed to do so for polygons, but need it dynamically on all feature types (point, line polygon)
The solution for polygons is using multiple styles, as shown below.
...ANSWER
Answered 2019-May-13 at 08:22Handle each type of geometry differently as getCoordinates returns different object of coordinates depending on the type of geometry passed.
Check this
QUESTION
I am embarrassed by how elementary this problem seems, but I can't seem to work out how to simply add a GeoJSON polygon feature to a vector source.
I'm using OpenLayers 5, and up until now I've been creating a separate source and layer for every feature I'm adding to the map. The reason being I needed to be able to turn the visibility of individual polygons on and off, and this seemed like the best way to do that at the time. This worked at first, but I'm sure it's not the best practice - in effect I'm creating 200 layers and 200 sources for 200 polygons. I'd prefer to be creating one layer which uses one source which contains those 200 polygons.
This is what I currently have:
...ANSWER
Answered 2019-Apr-12 at 11:51geometry.coordinates[0] looks like an open linestring. To use it as a polygon you would need to close the ring and, as a polygon is an array of linear rings, enclose with []. Also the coordinates are the first parameter of the constructor, not an option:
QUESTION
I am using 'three.js' and 'three-decal-geometry' with an Angular6 application. See below for imports:
...ANSWER
Answered 2018-Aug-27 at 23:12This isn't a Three.js issue. Looks like you're using TypeScript, and the problem is that you're using an external script (that's not part of the core three.js) without declaring its type.
When you include "@types/three" on your dev dependencies, you're including TypeScript definitions of only the core three.js library. So when you try to use THREE.DecalGeometry, your compiler is saying "Wait a minute, DecalGeometry is not part of THREE!"
A quick solution is to simply cast the type to any. Doing this tells TypeScript not to perform type-checking, although it won't catch any errors:
QUESTION
In an effort to learn a little bit more about custom geometry in three.js, I tried adapting Paul Bourke's capsule geometry example.
With my custom capsule geometry, I am currently having two issues:
- The middle face normals are not oriented properly.
- There is a hard seam along the side. (EDIT: fixed by deliberately computing the face normals. updated code in the gist)
And maybe one bonus question that has been lingering on my mind:
- What might a general strategy be to add vertex loops in that middle segment?
I'm really happy with the geometry in general, but would anyone be able to give me some direction on how to address these issues? I feel like the normal issue in the middle segment must be the orientation of the faces, and here is the related face construction snippet:
...ANSWER
Answered 2018-Apr-05 at 19:57The shading/normal seam is there because you have probably explicitly defined a hard edge there.
When you run your loops to generate the vertices, you probably duplicate the starting position. If you start at 0, and go all the way to 2PI, 0==2PI. When you weave the triangles, you probably tell the lest one to use the 2PI instead of 0 and even though they are in the same position, as far as triangles are concerned, they point to different vertices, and are thus not connected.
QUESTION
I'm worked with Three.JS before, but not on meshes. I think I am approaching my problem the right way, but I'm not sure.
The Goal
I'm trying to make a 3D blobby object that has specific verticies. The direction of the verticies are fixed, but their radius from center varies. You can imagine it sort of like an audio equalizer, except radial and in 3D.
I'm open to scrapping this approach and taking a totally different one if there's some easier way to do this.
Current Progress
I took this example and cleaned/modified it to my needs. Here's the HTML and JavaScript:
HTML (disco-ball.html)
ANSWER
Answered 2017-Aug-12 at 14:10Three provides a huge range of options. These are just suggestions, your best bet is to read the Three documentation start point and find what suits you.
A mesh is just a set of 3D points and an array of indexes describing each triangle. Once you have built the mesh you only need to update the verts and let Three update the shader attributes, and the mesh normals
Your questionsQ1. Use Three.Geometry for the mesh.
Q2. As you are building the mesh you can use the curve helpers eg Three.CubicBezierCurve3 or Three.QuadraticBezierCurve3 or maybe your best option Three.SplineCurve
Another option is to use a modifier and create the simple mesh and then let Three subdivide the mesh for you. eg three example webgl modifier subdivision
Though not the fastest solution, if the vert count is low it will do this each frame without any loss of frame rate.
Q3. Using Three.Geometry you can can set the mesh morph targets, an array of vertices.
Another option is to use a modifier, eg three example webgl modifier subdivision
Or you can modify the vertices directly each frame.
QUESTION
I have a json schema representing a geometry as a Point or a MultiPoint. Each is defined within the schema in "definitions":
...ANSWER
Answered 2017-Jul-17 at 14:20Haven't tested it myself, but according to this, you can make use of JSON pointers:
In file geometry.json:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install Geometry.js
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page
