I want to point a spot light towards a specific object. According to documentation (https://aframe.io/docs/1.3.0/components/light.html)
there is an property target that takes the id of the object to point to. However target does not seem to react to any value.
<a-light position="10 10 10" rotation="0 0 0" scale="1 1 1" light="type:spot;color:#ff0000;intensity:100;distance:1000;decay:0.1;angle:3;penumbra:0; target:myplane"></a-light>
Here is my codepen example:
https://codepen.io/jimver04/pen/JjZRJLz
A-Frame Version: 1.3.0
Platform / Device: Windows 10, Firefox 106, Desktop 3080 RTX GPU
Reproducible Code Snippet or URL: https://codepen.io/jimver04/pen/JjZRJLz
I found it, it just needs a # before the plane id
<a-light position="10 10 10" rotation="0 0 0" scale="1 1 1" light="type:spot;color:#ff0000;intensity:100;distance:1000;decay:0.1;angle:3;penumbra:0;target:#myplane"></a-light>
Related
My environment:
qt.scenegraph.general: QSG: basic render loop
qt.scenegraph.general: Using sg animation driver
qt.scenegraph.general: texture atlas dimensions: 2048x2048
qt.scenegraph.general: R/G/B/A Buffers: 8 8 8 0
qt.scenegraph.general: Depth Buffer: 24
qt.scenegraph.general: Stencil Buffer: 8
qt.scenegraph.general: Samples: 0
qt.scenegraph.general: GL_VENDOR: Imagination Technologies
qt.scenegraph.general: GL_RENDERER: PowerVR Rogue GE7800
qt.scenegraph.general: GL_VERSION: OpenGL ES 3.2 build 1.10#5187610
I am running a Hello world QML program and config as above.
QT_QPA_EGLFS_SWAPINTERVAL=0
QT_QPA_UPDATE_IDLE_TIME=0
QSG_RENDER_LOOP=basic
I test the QT_QPA_EGLFS_SWAPINTERVAL via PVRTrace https://www.imgtec.com/developers/powervr-sdk-tools/pvrtrace/
it shows the eglSwapInterval did set properly as above.
But the problem is the program stuck on 60FPS.
Why I cannot disable the V-Sync.
The short answer is that vsync behavior is entirely platform dependent. In reality eglSwapInterval() is actually just hint and it is implementation-defined whether it actually does anything at all. On most platforms it doesn't - e.g. on Android you can neither disable it nor fix FPS at 30. Suggest raising this with the platform provider.
I simply cannot get the textures to load for my basic 3d models. The model appears but is only in grey.
I am using this model: https://www.turbosquid.com/3d-models/free-max-mode-hammer/384372
I am using the following code.
<a-asset-item id="hammer-obj" src="hammer.obj"></a-asset-item>
<a-asset-item id="hammer-mtl" src="hammer.mtl"></a-asset-item>
<a-entity
obj-model="obj: #hammer-obj; mtl: #hammer-mtl"
scale="1 1 1"
position="0.05 1 -1.90">
My MTL file currently looks like:
newmtl head
Ka 0 0 0
Kd 0 0 0
Ks 0.637 0.637 0.637
illum 2
Ns 2
map_Kd hammer.jpg
map_bump hammer.jpg
bump hammer.jpg
newmtl grip
Ka 0 0 0
Kd 0 0 0
Ks 1 1 1
illum 2
Ns 2
map_Kd hammer.jpg
map_bump hammer.jpg
bump hammer.jpg
I have converted the TIFF file into a jpg as well and that didnt work. I initially had all links to hammer.TIF but I tried JPEG.
Could anyone give me any insight as to what is happening?
Thanks.
If You want to get results 'as expected', my recommendation is the three.json and .glTF formats.
Apparently they are well implemented, and don't cause unexpected behaviour like obj's with mtl's, or sadly fbx's.
In my opinion You should use some blender glTF( 1 or 2 ) exporter, and change the 3D hammer model format, or You could use clara.io, to export it to the three.js json format.
Don McCurdy of the a-frame team recommended using the glTF and json format here.
In fact there is some valuable information there, like how using the material component to texture the .obj with a .jpg works randomly.
You can also find more information on model troubleshooting here.
I am new to a-frame and have followed the examples of haydenjameslee networked-aframe. I was wondering if there is a way to specify the room size when defining the a-scene in it's tag
<a-scene networked-scene="app: myApp; room: room1;">
I have a workaround, for I don't fully understand how the component works.
I found there is a player list under the reference NAF.entities.entities
I made a component attached to the scene:
AFRAME.registerComponent('foo',{
init:function(){
setTimeout(function(){
console.log(Object.keys(NAF.entities.entities));
console.log(Object.keys(NAF.entities.entities)[0]);
console.log(Object.keys(NAF.entities.entities).length);
},5000);
}
});
The first log gives me an array of the players id's.
The second one gives the id of the first element.
The last gives me the number of the players.
You can check for the number of players on load, and if the number is exceeded, just deny access, change the room, or href to a 'lobby' website.
Working glitch here: glitch.com/edit/#!/sudden-antler
Of course instead of waiting 5 seconds i should be listening to a loaded event, I'll look into it once im not so busy.
As far as I know this is not possible in A-Frame.
What do you need it for?
An NPM Package aframe-room-component is available that easily lets you create rooms and connects them. Serves my need.
https://www.npmjs.com/package/aframe-room-component
It can be used as follows
<rw-room position="-3 0 -5" material="color:#787">
<rw-floor material="color:red"></rw-floor>
<rw-ceiling material="color:blue"></rw-ceiling>
<rw-wall position="6 0 0" material="color:yellow"></rw-wall>
<rw-wall position="6 0 6" material="color:green"></rw-wall>
<rw-wall position="0 0 6" material="color:brown"></rw-wall>
<rw-wall position="0 0 0" material="color:pink"></rw-wall>
</rw-room>
I have this asset definition:
<a-asset-item id="DNA"
crossorigin="anonymous"
src="https://cdn.glitch.com/2dd120f4-5d77-403f-af9d-feb8e33ed767%2FAR_DNA.dae">
</a-asset-item>
And this reference in my scene:
<a-entity collada-model="#DNA"
position="-60 0 0"
scale="2 2 2"
rotation="0 90 0" model-monitor></a-entity>
When I look at the network window in my browser console, I'm seeing the asset being downloaded twice. And it's 12 mb.
Why is this happening?
I'm trying to load an .obj which has several .jpgs as textures. My .obj is rendering - but without applying the material.
The .mtl looks like
newmtl material_0
Ka 0.200000 0.200000 0.200000
Kd 1.000000 1.000000 1.000000
Ks 1.000000 1.000000 1.000000
Tr 1.000000
illum 2
Ns 0.000000
map_Kd tex_0.jpg
I assume the path to the .jpgs are correct - if I change it, I see 404 errors in the console.
My aframe code is:
<a-scene>
<a-assets>
<a-asset-item id="moore-obj" src="obj/moore.obj"></a-asset-item>
<a-asset-item id="moore-mtl" src="obj/moore.obj.mtl"></a-asset-item>
</a-assets>
<a-entity
obj-model="obj: #moore-obj; mtl: #moore-mtl"
scale="1 1 1"
rotation="0 0 0"
position="1 1 1"></a-entity>
</a-scene>
The 3D model appears in the scene - but there are no textures overlayed on it. I'm running this on localhost, and I'm not seeing any CORS warnings.
The object is http://www.thingiverse.com/thing:36415
Turns out to be an issue with that particular OBJ file. It uses three materials but it doesn't define object groups for the sub-objects that use each of those materials, so Three.js' OBJLoader doesn't associate the materials correctly.
You can work around it by adding group lines before each usemtl line in the obj file.
For example:
g g_0
usemtl material_0
...
g g_1
usemtl material_1
etc.