Newer
Older
AegisforEcosystem / next / AR.js-3.4.0 / aframe / examples / location-based / max-min-distance / index.html
@KAOKA Daisuke KAOKA Daisuke on 31 May 2022 1 KB into AR.js
<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>GeoAR.js demo</title>
    <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
    <script type='text/javascript' src='../../../build/aframe-ar-nft.js'></script>
</head>

<body><!-- style='margin: 0; overflow: hidden;'>-->
    <a-scene
        vr-mode-ui="enabled: false"
		arjs='sourceType: webcam; videoTexture: true; debugUIEnabled: false;'>

        <!-- too near, is like 2m far -->
        <a-box material="color: red;" scale="25 25 25" gps-entity-place="latitude: 44.504493; longitude: 11.301134;"></a-box>

        <!-- visible, is like 400m far -->
        <a-box material="color: yellow;" scale="25 25 25" gps-entity-place="latitude: 44.506477; longitude: 11.301524;"></a-box>

        <!-- too far, is like 2.5km far -->
        <a-box material="color: green;" scale="25 25 25" gps-entity-place="latitude: 44.500013; longitude: 11.277351;"></a-box>

        <a-camera
            rotation-reader
            gps-camera="simulateLatitude: 44.504348; simulateLongitude: 11.301027; minDistance: 50; maxDistance: 700;"
        >
        </a-camera>
    </a-scene>
</body>