Comments (7)
I do not know what causes this. But I guess phaser and enable3d are out of sync in some way.
Can you please upload a simple demo scene or can you give me private access to your repo? I guess I will be able to track down the issue if I see the code.
from enable3d-website.
I made the same mistake using your example, and your template:
https://github.com/Trusiak/enable3d-test
or this class, if you don't want to clone whole repo: https://addpaste.com/c70cbc1679b9c3ffc5f97139f7477398
remember, that i did not use any scaling mode of canvas element (only const dimensions).
and here again the screenshoots for you:
https://imgur.com/a/q0LuvOV
from enable3d-website.
I see. You actually have to keep these lines,
// adjust width and height
this.third.renderer.setSize(1280, 720)
// @ts-ignore
this.third.camera.aspect = 1280 / 720
this.third.camera.updateProjectionMatrix()
when you set a fixed width and height to the Phaser.Game config.
const config: Phaser.Types.Core.GameConfig = {
type: Phaser.WEBGL,
backgroundColor: '#ffffff',
scale: {
width: 1280,
height: 720
},
scene: [PreloadScene, MainScene],
...Canvas()
}
This way three.js and phaser.js have the same rendering size.
from enable3d-website.
Thank you for your answer.
I have a few more questions because you are in the process of writing the documentation. :)
-
How can I give texture to the custom ground?
I know I can refer to it with scene.third.ground - but unfortunately I can't load the texture into it. -
How can I enable shadows on new ground? Using this example: https://enable3d.io/examples/load-and-use-textures.html unfortunately, I'm not able to get shadows and I can't find anywhere to turn them on.
-
Is there / will there be a possibility to attach the 3d model with FBX extension to the dice, other models? I mean, situations where I have a 3d warrior and wants to attach a sword under his hand bone.
Three.js doesn't offer this solution with FBX (or I haven't found it).
Forgive me if I asked trivial questions - but I really looked for a good hour and found nothing. :)
from enable3d-website.
-
Do not initialize the default ground
this.third.warpSpeed('-ground')
and add your own groundthis.third.ground = this.third.physics.add.ground({ }, { phong: { map: TEXTURE } })
-
There is a small bug. But I have updated the example.
-
In three.js you can add child objects. If you have a arm or hand mesh/bone, you can simply do
hand.add(weapon)
. Take a look at the updated fbx-loader-and-animations example.
from enable3d-website.
Ok, but the next problem is, when i try to load another FBX object as child of player, the object (weapon) spawn in cooridates 0,0,0. This problem doesn't exist on "add.box" method (everything is fine like in your example).
Should I give some position to the attached object so that it can appear in the bone or change
this scene.third.add.existing(this);
line?
My code:
//this piece of code were from the player class
this.traverse(child => {
if (child.name === 'Bip01_Spine') {
child.add(new Weapon(scene))
}
})
//this is a weapon class
export class Weapon extends ExtendedObject3D {
constructor(scene){
super()
scene.third.load.fbx('/assets/sword_anim.fbx', object => {
this.add(object)
this.traverse(child => {
if (child.isMesh) child.castShadow = child.receiveShadow = true
})
this.scale.set(0.005, 0.005, 0.005)
scene.third.add.existing(this);
})
}
}
PS.
you should also make the paypall available as a form of grant for you :P
from enable3d-website.
I do not know. Sometimes it can get tricky.
Yes, try to add position and rotation. Maybe you have to multiply the coordinates with your scale?
// get position and rotation
this.traverse(child => {
if (child.name === 'Bip01_Spine') {
const { position, rotation } = child
child.add(new Weapon(scene, position, rotation))
}
})
You could also always ask in the three.js forum, since this is a very three.js specific question.
I do already have patreon :)
from enable3d-website.
Related Issues (7)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from enable3d-website.