Git Product home page Git Product logo

a-frame-examples's Introduction

A-Frame Examples

The goal of this collection is to provide a set of basic and instructive examples that introduce the various features of the A-Frame library, and to introduce new A-Frame components.

Examples can be viewed using a normal web browser. Some examples contain interactive virtual reality components that require a VR headset (Oculus Quest).

View the examples online at https://stemkoski.github.io/A-Frame-Examples/.

a-frame-examples's People

Contributors

stemkoski avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

a-frame-examples's Issues

Curve following

Any thoughts to adding pause, resume, and reverse to curve following component? To me these features haven been hard to implement. I got them working with out of box aframe animation over multiple paths but it doesnt support curves.

Thanks for all the examples!

Use "Fireworks" example in AR

Is it possible to use the fireworks example in AR? I'm trying to use it with 8th Wall, but if I attach the emitter to either the camera, or any object in the scene, the Camera view turns white. (Its almost like I'm inside the firework).

Any suggestions?

Not a Bug but a Feature

Hi✌️

Would love to contribute in helping with Testing or any other issues, i've love using aframe to make projects and this repositories has helped so much!

Just wanted thank you and offer any help if needed🙏

will close issue

Generating positions in viewable area for paths grow entity from tiny to full scale

I am using the curve follow component and your flying bird animation and want to have it fly from various far viewable distances to me (tiny to full scale). I initially thought I could generate x, y and sync z with time, however, this essentially comes from one spot when using a large negative z-depth. Do you know of a way to generate positions in a viewable area from very small to full scale coming towards the camera?

Really appreciate your examples.

Problem with aframe 1.4.1 & Quest 2

The example quest-physics.html gives this error with Aframe 1.4.0

physics.js:666 Uncaught TypeError: Cannot read properties of undefined (reading 'clamp')
at i.tock (physics.js:666:36)
at bind.js:12:17
at i.tock (index.js:127:7)
at v.tock (a-scene.js:725:36)
at e.object3D.onAfterRender (a-scene.js:52:34)
at hl.render (three.module.js:28497:39)
at v.render (a-scene.js:751:14)
at bind.js:12:17
at three.module.js:28350:35
at r (three.module.js:12556:3)

questions on screen controls

Hello, I really like the screen-controls interaction for desktop PC, and I would like to use it for a scientific outreach data visualization project. What is important for my project is to be able to precisely move in 3D with the arrows (or keyboard), and then look around the scene by dragging the mouse, in a sort of "Google Earth" style.

I have a few questions:

  • Is it possible to use keyboard arrows (instead of WASD plus RF) for movement? Particularly the four up/down/left/right arrow for horizontal movement and page up/page down for flying up and down? This would make things more intuitive and also more compatible with different international keyboards that have keys placed in different ways.

  • On tablets and smartphones I would like to disable the sensors and simply drag one finger on the screen for rotating the look direction (so exactly the same as on a desktop, minus the keyboard). This is useful when e..g students have their tablet placed on a desk and you don't want the whole classroom standing and moving around like mad people.

  • Interaction with objects, e.g. to interrogate them and show some information as text and/or an image, could be done with double clicks or double-taps. Do you have an example of this?

  • I imagine that putting the fly-up/fly-down arrows in the lower-left corner (instead of upper left) is easy. Which is the relevant parameter?

  • In any case, how shall I modify your example to add my data, that come as a collection of textured OBJ files stored in a folder?

  • Finally, I see that the WASD arrow result in movement in the original reference frame. Maybe it would be more intuitive to move according to your look direction, so W would be associated to the direction where you are looking at, etc. Would this be possible? Note that I think that this behavior should be limited to movement in the horizontal plane, and fly-up/fly-down should not be influenced by the look direction (it would become a bit confusing).

I really thank you very much!

Controls per device

Nice extension of a-frame, however, how to change controls depending on the device ?

if (AFRAME.utils.device.isMobile()){

Dual Joysticks

} else if (AFRAME.utils.device.isMobileVR()){

look controls

} else {

Mouse + Keyboard

}

Best,
D.

How to use extended-wasd-controls with cameraRig + cameraHead ?

Hello
Your examples show how to use extended-wasd-controls with one camera.
My project is setting with 2 cameras entity, a cameraRig to move and a cameraHead to look. ( because can work in VR too )
How I can set extended-wasd-controls to control cameraRig/move with a joystick and cameraHead/look with another joystick ?

Thanks

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.