I am learning A-Frame and have come up with an issue I am trying solve. The issue is animating a radius for a sphere to create a pulsating effect ie the sphere grows and shrinks. I have created an AFRAME Component and in the animation path i have put in the code is
animation = "property: geometry.primitive.sphere.radius; from: 0.1; to: 0.9"
But I get an error in the console
Error: Unknown geometry schema 0.1
so I think the "0.1" is relating to the radius value.
I also tried another way by creating a THREE.SphereBufferGeometry but i cannot figure out the components path to put into the animation property.
Can anyone advise me the best way to animate the radius of a sphere i would greatly appreciate it.
Thanks
Darren
What do you mean by "I have created an AFRAME Component" ?
To know which property to animate, you can check here on the documentation to what each property is linked. For "radius" is associated with "geometry.radius".
I made a glitch that shows what you want to achieve, is it what you are looking for?
Related
Any tips how to do nice camera animation with the here SDK for flutter I can take examples from IOS or Android SDK.
The issue I’m facing is that in the example it shows animation with pre known camera zoom/distance to earth source and target.
In my example it’s difficult to find the right distance to earth given a bounding box and also find the center of a bounding box finally find the right bounding box to be able to comfortably see a set of GeoCoordinates.
Any tips much appreciated
There's nice bow-type animation example for Flutter. It's using custom Tweens.
If you want to zoom to a set of coordinates, use the MapCamera's calculateEnclosingCameraUpdate() method. It allows to zoom to a bounding box you can get from a route with route.getBoundingBox(). This way you can ignore the distance or center as the camera will automatically find the right value.
There's no need to show the code as the Codecademy exercise tries to explain how the inspector works. So basically I've learned how to make the camera start or to move in the scene. So my question isn't about moving the camera. Rather, what I want is (using the inspector) to rotate the scene in order to look up at a certain character through the ground.
Where in the element subsection can I find the coordinates of the scene? I know the camera is positioned at (0,0,0) by default and you can move around using the ASWD movement keys. Although I don't think I can see from the ground using those keys.
I hope I'm being specific enough and there's no issue with the question. I've Googled for some time but I haven't found an answer. So if an answer is out there, sorry for not having found it.
Thanks in advance.
Edit: enter image description here
I've managed to enter into the A-Frame inspector (as I was using the default one) and drag the <a-entity> as I think this is the camera object. Now, how can I try and see this picture from the ground?
Thanks for editing my question. Feel free to do it. Have a nice day.
You're doing this Codecademy exercise?
I think you should find out where you can modify the a-plane primitive. Then play around with its rotation property.
I have a qml canvas with many elements, and when I zoom in, the elements needs to redrawn, if the canvas size grows too much, the rendering is delayed and quite visible.
I couldnt use the canvassize, canvaswindow properly to render only part of the scene, didnt find any proper examples to use this.
Could some expert please guide me with very minimalistic code.
Also, I see that these properties are marked as not to be used in future, does anyone know what is it that replaces ?
Regards,
Indrajit
I would like to add a sphere with a 2d gradient as texture to create a skydome. I read that in openGL this is often solved by rendering the skybox without depthtest in an additonal pass.
I disabled depthTest on my sphere so everything else is drawn in front of it, it's kinda giving me the disired effect but depending on the camera angle it clips through other objects in my scene.
I was looking at several examples which make use of THREE.EffectComposer and a second scene, I may be completely after the wrong thing here but I think that could solve this. The thing is I havent ever touched the effectComposer and have no idea at all how to work with it and which things i exactly need.
I would aprreciate any input on this, maybe I'm after the wrong stuff at all.
Here are two three.js examples in which a skydome with a gradient is created. They do not involve EffectComposer or disabling depth test.
http://mrdoob.github.com/three.js/examples/webgl_lights_hemisphere.html
http://mrdoob.github.com/three.js/examples/webgl_materials_lightmap.html
three.js r.55
You dont have to use a cone or other 3D-geometry to simulate a gradient sky.
I solved it using a canvas (with 3 gradient-spots, lightblue -> white (horizon) -> darkblue) and draw it as sprite in front of my camera with the right distance to it (fog-distance).
You only have to manage the distance when moving/rotating your cam.
Tip: Use mesh.scale.set (xx,xx,1) to zoom the canvas-texture to needed size.
I'm currently working on a WYSISYG editor that allows the user to move, resize and rotate shapes by directly manipulating them. The resizing seems to be fairly complex when the shape is rotated. I got this working for non-rotated shapes, but it will take some trigonometric calculations to resize shapes that are rotated. The registration point is always is the middle of the rectangle because this makes rotating a lot easier.
Before I start implementing this, I was wondering if anyone knew of any libraries or sample source code that does this, or could share some tips and tricks to calculate the transformations.
I have the following parameters:
rotation (in degrees)
width, height
x, y
mouseX, mouseY
I attached a screenshot of what I'm trying to accomplish and another one that has some lines drawn onto it that should allow me to deduct the trigonometric calculations. The cross is the cursor.
alt text http://www.herrodius.com/images/resize.jpg
alt text http://www.herrodius.com/images/resize_lines.jpg
You might look at flex-object-handles, in particular the more recent version 2.
I recommend Transform Manager - http://www.greensock.com/transformmanageras3/
It's actually not that hard. Use the mouse coordinates (mouseX / mouseY)from the rotated display object and they will be transformed for you!