react-360 | 易学教程

Access React Object from within page JS?

阅读更多关于 Access React Object from within page JS?

问题 I have a ReactVr object which I am rendering with the code below. After React is initialised I am periodically receiving server updates which I want to pass into React as props, how can I do this? Can props in the React object be set from my "normal" JS? ReactVR.init( './build/index.bundle.js', document.body, // third argument is a map of initialization options { initialProps: { source: 'world.json', userType: "typ1" }, cursorVisibility: 'visible' } ); Edit: Server updates are coming via a

Is it possible to link to external images / videos with React-VR?

阅读更多关于 Is it possible to link to external images / videos with React-VR?

问题 According to the documentation, there doesn't seem to be any examples of using external images or external videos (i.e. from YouTube). I was wondering if anyone knew if it was possible (like this) <Video style={{ width: 3.0, height:2.0, transform: [{translate: [0, 4, 5]}, {rotateY : 180} ], }} source={{uri: 'https://www.youtube.com/watch?v=vPCoxAlfFsw'}} /> 回答1: MediaPlayerState in react vr home page 来源： https://stackoverflow.com/questions/43748706/is-it-possible-to-link-to-external-images

How do I detect Gear VR inputs in React VR scene?

阅读更多关于 How do I detect Gear VR inputs in React VR scene?

问题 I am trying to create a web app using React VR and run it using Samsung Gear VR. I could not see the default white dot (VR pointer) while in VR mode in my scene. Consequently methods such as "onInput" and "onClick" are not working. The same methods work quite fine if I view the same scene outside VR mode - even using the browser provided in Gear VR. Am I missing something? How do I access those methods while in VR mode in Gear VR? Example code that works fine in normal web browser (including

Persistent bridge between a React VR component and native module code

阅读更多关于 Persistent bridge between a React VR component and native module code

问题 I am trying to have my browser send in some DOM events into the React VR components. The closest I got is this code using "native modules." (client.js) const windowEventsModule = new WindowEventsModule(); function init(bundle, parent, options) { const vr = new VRInstance(bundle, 'WelcomeToVR', parent, { ...options, nativeModules: [windowEventsModule] }); windowEventsModule.init(vr.rootView.context); vr.start(); return vr; } window.ReactVR = {init}; (WindowEventsModule.js) export default class

Persistent bridge between a React VR component and native module code

阅读更多关于 Persistent bridge between a React VR component and native module code

Is it possible to link to a 360 YouTube video with ReactVR?

阅读更多关于 Is it possible to link to a 360 YouTube video with ReactVR?

问题 In the documentation for ReactVR for VideoPano it demonstrates pointing to a video in the code base. Is it possible to link to an external link (aka Youtube)? So instead of video.mp4, it would link to https://www.youtube.com/watch?v=hkgYIr_LWPw&index=1&list=PL-BE7kqSgbEj44peyt5BmLK63kbDp7Rhu let videoUrl = 'video.webm'; const supportedFormats = NativeModules.VideoModule.supportedFormats; for (let i = 0; i < supportedFormats.length; i++) { if (supportedFormats[i] === 'mp4') { videoUrl = 'video

How do I keep some element fixed on the screen in react-VR

阅读更多关于 How do I keep some element fixed on the screen in react-VR

问题 I want to keep a score or a health bar always visible in a react-vr app. I could use VrHeadModel - rotation, yawPitchRoll and position, but having to calculate it just to keep it fixed... seems like I am missing something. How do I do this? 回答1: The answer is to use multiple surfaces: one that isn't headlocked and another that is headlocked. See "Using Multiple Surfaces" here: Surfaces - React 360 To get yours working, paste the missing code from the example into your client.js and index.js

How do I keep some element fixed on the screen in react-VR

阅读更多关于 How do I keep some element fixed on the screen in react-VR

I want to keep a score or a health bar always visible in a react-vr app. I could use VrHeadModel - rotation, yawPitchRoll and position, but having to calculate it just to keep it fixed... seems like I am missing something. How do I do this? The answer is to use multiple surfaces: one that isn't headlocked and another that is headlocked. See "Using Multiple Surfaces" here: Surfaces - React 360 To get yours working, paste the missing code from the example into your client.js and index.js files respectively: Here is a link to a working example (partially pasted below): Headlocked Surfaces import

Persistent bridge between a React VR component and native module code

阅读更多关于 Persistent bridge between a React VR component and native module code

I am trying to have my browser send in some DOM events into the React VR components. The closest I got is this code using "native modules." (client.js) const windowEventsModule = new WindowEventsModule(); function init(bundle, parent, options) { const vr = new VRInstance(bundle, 'WelcomeToVR', parent, { ...options, nativeModules: [windowEventsModule] }); windowEventsModule.init(vr.rootView.context); vr.start(); return vr; } window.ReactVR = {init}; (WindowEventsModule.js) export default class WindowEventsModule extends Module { constructor() { super('WindowEventsModule'); this.listeners = {};