webvr-page | webvr boilerplate optimized to support webVR | Augmented Reality library

 by   pindiespace JavaScript Version: Current License: Non-SPDX

kandi X-RAY | webvr-page Summary

kandi X-RAY | webvr-page Summary

webvr-page is a JavaScript library typically used in Virtual Reality, Augmented Reality, Three.js, WebGL applications. webvr-page has no bugs, it has no vulnerabilities and it has low support. However webvr-page has a Non-SPDX License. You can download it from GitHub.

Developed from WebVR Boilerplate, with additions allowing multiple VR scenes to work well in a web page DOM, and a more sophisticated Ui player. WebVR [Boilerplate] is a a THREE.js and webvr-boilerplate- based starting point for VR experiences that work well in both Google Cardboard and other VR headsets. The goal of this project is to add a display mode for 3D scenes that allows them to be embedded in a standard web page. Current VR boilerplates grab the entire browser window. WebVR Page plays nice with other VR scenes embedded on the same page. This allows creating web pages with animated image galleries showing VR scenes for users to select. By contrast, most 3D browser frameworks use a static image on the web page, which links to a "fullwindow" version of the 3D scene. WebVR Page is therefore, an attempt to improve User Experience. The project also defines a minimal semantically-coded HTML5 player for the VR scene, which will validate when embedded in a web page along with other DOM content and play nice with text readers and search engines. This differs from other current VR boilerplates, are non-validating and unfriendly to text readers in their fullscreen and VR modes. Finally, the adaptation is not restricted to THREE.js, but potentially could be modified to work with other libraries, e.g. Babylon.js.
Support
    Quality
      Security
        License
          Reuse

            kandi-support Support

              webvr-page has a low active ecosystem.
              It has 3 star(s) with 1 fork(s). There are 2 watchers for this library.
              OutlinedDot
              It had no major release in the last 6 months.
              webvr-page has no issues reported. There are no pull requests.
              It has a neutral sentiment in the developer community.
              The latest version of webvr-page is current.

            kandi-Quality Quality

              webvr-page has no bugs reported.

            kandi-Security Security

              webvr-page has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.

            kandi-License License

              webvr-page has a Non-SPDX License.
              Non-SPDX licenses can be open source with a non SPDX compliant license, or non open source licenses, and you need to review them closely before use.

            kandi-Reuse Reuse

              webvr-page releases are not available. You will need to build from source code and install.
              Installation instructions are available. Examples and code snippets are not available.

            Top functions reviewed by kandi - BETA

            kandi's functional review helps you automatically verify the functionalities of the libraries and avoid rework.
            Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of webvr-page
            Get all kandi verified functions for this library.

            webvr-page Key Features

            No Key Features are available at this moment for webvr-page.

            webvr-page Examples and Code Snippets

            No Code Snippets are available at this moment for webvr-page.

            Community Discussions

            QUESTION

            RealityKit app and lower iOS deployment target
            Asked 2022-Mar-10 at 15:04

            I have an iOS app with deployment target iOS 10+, I need to add some features that depend only on RealityKit to appear with users whom their iOS version is 13+, the app compiles and runs successfully on real device but the problem is when archiving for upload to AppStore it generates a Swift file and says:

            ...

            ANSWER

            Answered 2022-Mar-10 at 15:04
            Firstly :

            Do not include Reality Composer's .rcproject files in your archive for distribution. .rcproject bundles contain the code with iOS 13.0+ classes, structs and enums. Instead, supply your project with USDZ files.

            Secondly :

            To allow iOS 13+ users to use RealityKit features, but still allow non-AR users to run this app starting from iOS 10.0, use the following code:

            Source https://stackoverflow.com/questions/71000365

            QUESTION

            How to use RealityKit's image AnchorEntity in SwiftUI?
            Asked 2022-Jan-08 at 20:36

            I want to use RealityKit's AnchorEntity initialized with an Anchoring Component Target of type Image. Here is what I am trying to do:

            ...

            ANSWER

            Answered 2022-Jan-08 at 20:36

            You can use AnchorEntity(.image(...)) in SwiftUI almost the same way as you used it in UIKit. At first click Assets.xcassets in Project Navigator pane and create AR Resources folder. Drag your image there. Setup its physical size in Inspector. Then copy/paste the code:

            Source https://stackoverflow.com/questions/70634542

            QUESTION

            Augmented Reality – Lighting Real-World objects with Virtual light
            Asked 2021-Dec-16 at 17:25

            Is it possible to import a virtual lamp object into the AR scene, that projects a light cone, which illuminates the surrounding space in the room and the real objects in it, e.g. a table, floor, walls?

            For ARKit, I found this SO post.

            For ARCore, there is an example of relighting technique. And this source code.

            I have also been suggested that post-processing can be used to brighten the whole scene.

            However, these examples are from a while ago and perhaps threre is a newer or a more straight forward solution to this problem?

            ...

            ANSWER

            Answered 2021-Dec-16 at 17:25

            At the low level, RealityKit is only responsible for rendering virtual objects and overlaying them on top of the camera frame. If you want to illuminate the real scene, you need to post-process the camera frame.

            Here are some tutorials on how to do post-processing: Tutorial1⃣️ Tutorial2⃣️

            If all you need is an effect like This , then all you need to do is add a CGImage-based post-processing effect for the virtual object (lights).

            More specifically, add a bloom filter to the rendered image(You can also simulate bloom filters with Gaussian blur).

            In this way, the code is all around UIImage and CGImage, so it's pretty simple😎

            If you want to be more realistic, consider using the depth map provided by LiDAR to calculate which areas can be illuminated for a more detailed brightness.

            Or If you're a true explorer, you can use Metal to create a real world Digital Twin point cloud in real time to simulate occlusion of light.

            Source https://stackoverflow.com/questions/70348881

            QUESTION

            How to show image from gallery in realitykit?
            Asked 2021-Dec-12 at 08:44

            I want to show image from gallery. i am loading the image using imagePicker.

            ...

            ANSWER

            Answered 2021-Dec-12 at 08:44

            Try this. Take into consideration, a tint color is multiplied by an image – so, if tint's RGBA = [1,1,1,1], a result of multiplication will be an image itself (without tinting)...

            Source https://stackoverflow.com/questions/70321744

            QUESTION

            How to fix AR connected issue in my device?
            Asked 2021-Nov-23 at 13:58

            I am developing a website related to Augmented Reality. But my mobile phone (Samsung Galaxy M02S) is not supported AR. When I try to install ARcore, google play store show an error.

            So I installed ARcore using apk and now this app was installed. After that, I checked my mobile phone AR was supported or not. The below notification was shown when I try to see AR.

            How I fix this issue and have any other way to install ARcore into my phone?

            ...

            ANSWER

            Answered 2021-Nov-23 at 13:58

            AR Core requires some specific hardware to work. You can check the list of supported devices here. No amount of side loading will help because this is a hardware requirement issue. Moreover AR Core is under active development even if you somehow install a version that might work that version will soon be deprecated and you will start getting the popup saying you need to update.

            Kindly use a device that is part of supported list or an Emulator that supports this. IMHO it is best to develop using a device that has support from AR Core team.

            Source https://stackoverflow.com/questions/70081990

            QUESTION

            SCNKit: Hit test doesn't hit node's dynamically modified geometry
            Asked 2021-Aug-15 at 08:41

            I'm facing an issue where SCNView.hitTest does not detect hits against geometry that I'm modifying dynamically on the cpu.

            Here's the overview: I have a node that uses an SCNGeometry created from a MTLBuffer of vertices:

            ...

            ANSWER

            Answered 2021-Aug-13 at 15:46

            When you perform a hit-test search, SceneKit looks for SCNGeometry objects along the ray you specify. For each intersection between the ray and a geometry, SceneKit creates a hit-test result to provide information about both the SCNNode object containing the geometry and the location of the intersection on the geometry’s surface.

            The problem in your case is that when you modify the buffer’s contents (MTLBuffer) at render time, SceneKit does not know about it, and therefore cannot update SCNGeometry object which is used for performing hit-test.

            So the only way I can see to solve this issue is to recreate your SCNGeometry object.

            Source https://stackoverflow.com/questions/68723000

            QUESTION

            Error in displaying reality file from network
            Asked 2021-Jul-26 at 06:44

            I am trying to display a reality file created using Reality Composer. The below code works for usdz but not for reality. Here is my code

            ...

            ANSWER

            Answered 2021-Jul-26 at 06:44

            Uploading a .reality model from web works fine. You can easily check this in Xcode Simulator:

            Source https://stackoverflow.com/questions/68517968

            QUESTION

            Camera Intrinsics Resolution vs Real Screen Resolution
            Asked 2021-May-28 at 13:28

            I am writing an ARKit app where I need to use camera poses and intrinsics for 3D reconstruction.

            The camera Intrinsics matrix returned by ARKit seems to be using a different image resolution than mobile screen resolution. Below is one example of this issue

            Intrinsics matrix returned by ARKit is :

            [[1569.249512, 0, 931.3638306],[0, 1569.249512, 723.3305664],[0, 0, 1]]

            whereas input image resolution is 750 (width) x 1182 (height). In this case, the principal point seems to be out of the image which cannot be possible. It should ideally be close to the image center. So above intrinsic matrix might be using image resolution of 1920 (width) x 1440 (height) returned that is completely different than the original image resolution.

            The questions are:

            • Whether the returned camera intrinsics belong to 1920x1440 image resolution?
            • If yes, how can I get the intrinsics matrix representing original image resolution i.e. 750x1182?
            ...

            ANSWER

            Answered 2021-May-28 at 13:28
            Intrinsics 3x3 matrix

            Intrinsics camera matrix converts between the 2D camera plane and 3D world coordinate space. Here's a decomposition of an intrinsic matrix, where:

            • fx and fy is a Focal Length in pixels
            • xO and yO is a Principal Point Offset in pixels
            • s is an Axis Skew

            According to Apple Documentation:

            The values fx and fy are the pixel focal length, and are identical for square pixels. The values ox and oy are the offsets of the principal point from the top-left corner of the image frame. All values are expressed in pixels.

            So you let's examine what your data is:

            Source https://stackoverflow.com/questions/66893907

            QUESTION

            Adding multiple SCNNode(s) at the same time
            Asked 2021-May-21 at 04:36

            I have this function named addShapes. I want it to create 3 shapes

            ...

            ANSWER

            Answered 2021-May-21 at 04:36

            Your code works fine (a position was a problem):

            Source https://stackoverflow.com/questions/67629296

            QUESTION

            ARMeshAnchor – SceneKit SCNView Renderer EXC_BAD_ACCESS
            Asked 2021-Apr-21 at 00:26

            Im converting the ARMeshAnchor data to mesh using SCNGeometrySource which it works fine but sometimes 3/10 I will get a bad_access from SceneKit renderer.

            [![enter image description here][1]][1]

            ...

            ANSWER

            Answered 2021-Feb-07 at 11:58

            It occurs because ARMeshAnchors constantly update their data as ARKit refines its understanding of the real world. All ARMeshAnchors are dynamic anchors. However their mesh's subsequent changes are not intended to reflect in real time.

            If you want to duplicate your ARMeshAnchors collection use the following code:

            Source https://stackoverflow.com/questions/66070916

            Community Discussions, Code Snippets contain sources that include Stack Exchange Network

            Vulnerabilities

            No vulnerabilities reported

            Install webvr-page

            To make the boilerplate ready for use, you need to install several libraries. The boilerplate relies heavily on Node-based tools (npm and bower) to do the installs.
            If this fails, run the scripts under "preinstall" in the package.json file manually. Alternately, if an install fails on your mac, you may need to use the sudo command to go to Administrator (you'll need the password for your mac).
            Make sure you've installed Node (from http://nodejs.org)
            Clone from GitHub, or get the ZIP file.
            Open Terminal, and cd over to the directory you put the project in. type the following command:
            After this completes, type the following command:
            If you are running GitHub Desktop on Windows, you may need to use the GitHub shell (Windows PowerShell) instead of the NodeJS shell or basic command prompt to ensure git is in your path.
            Make sure you've installed Node (from http://nodejs.org)
            Clone from GitHub, or get the ZIP file.
            Open the command prompt
            Navigate to the directory you put the project in
            Type the following command:
            After this runs, type the following command:
            Check this article for more build methods for npm that work on windows.
            npm install - installs modules via npm and bower, also pre-installs some modules that need to be global.
            npm run build-three - use bower to install [webvr-polyfill] and [three] libraries in js/lib directory.
            npm run build-lib - copy THREE.js, THREE helpers for VR, and webvr-polyfill for non-VR browsers.
            npm run build-app - use the browserify compiler to compile modules of the application, minify, and copy a concatenated file to js/ directory.
            npm run build - standard development build of manager and THREE libraries.
            npm run buildall - download newest three.js and webvr-polyfill, and build library and app.
            npm run lint - check files in /src directory for the correct code syntax. Learn how it works at the jshint site
            npm run test - run mocha unit tests. Learn how at the mocha site.
            npm run start - run a Node server locally at port 3000.
            npm run clean - remove the js/directory.

            Support

            For any new features, suggestions and bugs create an issue on GitHub. If you have any questions check and ask questions on community page Stack Overflow .
            Find more information at:

            Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items

            Find more libraries
            CLONE
          • HTTPS

            https://github.com/pindiespace/webvr-page.git

          • CLI

            gh repo clone pindiespace/webvr-page

          • sshUrl

            git@github.com:pindiespace/webvr-page.git

          • Stay Updated

            Subscribe to our newsletter for trending solutions and developer bootcamps

            Agree to Sign up and Terms & Conditions

            Share this Page

            share link