AR.js의 Location Based에서 모델을 멀리서 표시하려고 하면 곤란합니다.
5730 단어 AR.jsJavaScript
1. AR용 아이콘으로 먼 곳의 지표를 표시하고 싶다
나는 AR로 스마트폰에 먼 곳의 지표를 표시하고 싶다.
활성 사용자 수는 월 100 이하로 가정하기 때문에 유료 라이브러리는 불가능하기 때문에 「AR.js」로 제작하기로 했다.
AR.js는 Marker Tracking, Image Tracking, Location Based를 지원하는 우수한 제품으로 html에서 몇 줄의 코드를 사용하면 AR을 실현할 수 있다.
포지셔닝 기본 AR은 GPS의 위치 정보에 따라 지정된 위치에 내용을 표시하는 구조입니다.이번에 우리는 AR.js의 Location Based와 A-Frame 버전을 사용하기로 결정했다.
희망으로서 이런 느낌입니다.
실제로 바늘 대신 지표의 아이콘 등을 표시한다.
2. 예제 코드를 통해 검증
AR.js 문서에 설명된 예시를 변경합니다.
샘플은 문자를 표시하고 이번에는 빨간색 BOX를 표시합니다.
장소는 홋카이도, 삿포로의 시계탑이다.
코드는 다음과 같습니다.
아주 간단해요.<a-scene>에 BOX를 표시합니다.
이번에는 코드의 상세한 설명이 본문제가 아니어서 하지 않는다🙏.
index.html<!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 src="https://unpkg.com/[email protected]/dist/aframe-look-at-component.min.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>
</head>
<body style="margin: 0; overflow: hidden;">
<a-scene
vr-mode-ui="enabled: false"
embedded
arjs="sourceType: webcam; debugUIEnabled: false;"
>
<a-box
material="color: red"
gps-entity-place="latitude: 43.062533; longitude: 141.353638;"
scale="50 50 50"
></a-box>
<a-camera gps-camera rotation-reader></a-camera>
</a-scene>
</body>
</html>
어?전혀 안 보여요.😫
왜 박스가 안 나오는지 모르겠어요.
너무 작지 않아요?이렇게 생각하면 scale를 확대해도 변하지 않는다.
반복적으로 시도해도 개선되지 않는다.
자신의 아이폰이 고장났습니까?시간이 많이 걸렸어요.
본가에 있는 issues.
약 1km 이상의 먼 곳의 대상은 표시되지 않습니다.
네?진짜예요?
패션은 아니지만
3.AR.js의 Location Based는 1km 이상 떨어진 객체를 표시하지 않습니다!
난 곤란해.
그리고 문서를 자세히 읽으면 이런 기록이 나온다.
참조 소스: AR.js Documentation
Viewing every distant object
If your location-based AR content is distant from the user (around 1km or more), it is recommended to use the new arjs-webcam-texture component (introduced in AR.js 3.2.0), which uses a THREE.js texture to stream the camera feed and allows distant content to be viewed. This component is automatically injected if the videoTexture parameter of the arjs system is set to true and the sourceType is webcam. For example (code snippet only):
이봐, 이봐, 이봐, 해결책이 있잖아!
다행이다.
이거 읽으면... <a-scene
vr-mode-ui="enabled: false"
embedded
arjs="sourceType: webcam; videoTexture: true; debugUIEnabled: false;"
>
videoTexture: true;의 규격화 거리의 멱 함수.
😆같은 코드를 설정하고 사용하려고 시도합니다.
4. 대상이 확실히 표시되지만 아이폰의 경우 화면이 다운됩니다.
객체는 표시되지만 카메라가 작동할 때의 경치로 인해 동결됩니다.
이곳의 동결은 화면의 보기와 카메라를 어느 쪽으로 향하게 하는 최초의 화면이 변하지 않은 상태를 가리킨다.
이것은 마치 영상 화면에 AR 콘텐츠를 중첩하는 것과 같다.
로그를 보면 iOS14라면 동영상의 자동 재생은 사용자의 명확한 허가가 필요하기 때문에 권한에서 튀어나오면 화면이 최초의 경치에서 응고됩니까?추측
이렇게 되면 AR는 아무것도 없겠지.
막혔지?이거
그럼 어떡하지?
5. 사도이지만 모든 대상을 1km 이내로 표시하면 된다.
나는 이 방향으로만 할 수 있다고 결심했다.
다음에는 지정된 지점의 방향과 거리를 1km 이내로 다시 설정하고 싶습니다.
③의 자신의 위치에서 ①의 실제 위치와 방향을 구하여 표시할 수 있는 위치 ②로 재배치할 계획이다.
어쩌면 또 다른 좋은 해결 방법이 있을지도 모른다.
다음에는 위치를 다시 계산하고 조정된 계획을 쓰겠습니다.
계속
AR.js의 Location Based에서 모형의 이야기를 멀리서 강제로 표시합니다.
Reference
이 문제에 관하여(AR.js의 Location Based에서 모델을 멀리서 표시하려고 하면 곤란합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/ebifry_w_t/items/ef41efa584c14b7f71ba
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
AR.js 문서에 설명된 예시를 변경합니다.
샘플은 문자를 표시하고 이번에는 빨간색 BOX를 표시합니다.
장소는 홋카이도, 삿포로의 시계탑이다.
코드는 다음과 같습니다.
아주 간단해요.
<a-scene>에 BOX를 표시합니다.이번에는 코드의 상세한 설명이 본문제가 아니어서 하지 않는다🙏.
index.html
<!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 src="https://unpkg.com/[email protected]/dist/aframe-look-at-component.min.js"></script>
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>
</head>
<body style="margin: 0; overflow: hidden;">
<a-scene
vr-mode-ui="enabled: false"
embedded
arjs="sourceType: webcam; debugUIEnabled: false;"
>
<a-box
material="color: red"
gps-entity-place="latitude: 43.062533; longitude: 141.353638;"
scale="50 50 50"
></a-box>
<a-camera gps-camera rotation-reader></a-camera>
</a-scene>
</body>
</html>
어?전혀 안 보여요.😫
왜 박스가 안 나오는지 모르겠어요.
너무 작지 않아요?이렇게 생각하면 scale를 확대해도 변하지 않는다.
반복적으로 시도해도 개선되지 않는다.
자신의 아이폰이 고장났습니까?시간이 많이 걸렸어요.
본가에 있는 issues.
약 1km 이상의 먼 곳의 대상은 표시되지 않습니다.
네?진짜예요?
패션은 아니지만
3.AR.js의 Location Based는 1km 이상 떨어진 객체를 표시하지 않습니다!
난 곤란해.
그리고 문서를 자세히 읽으면 이런 기록이 나온다.
참조 소스: AR.js Documentation
Viewing every distant object
If your location-based AR content is distant from the user (around 1km or more), it is recommended to use the new arjs-webcam-texture component (introduced in AR.js 3.2.0), which uses a THREE.js texture to stream the camera feed and allows distant content to be viewed. This component is automatically injected if the videoTexture parameter of the arjs system is set to true and the sourceType is webcam. For example (code snippet only):
이봐, 이봐, 이봐, 해결책이 있잖아!
다행이다.
이거 읽으면... <a-scene
vr-mode-ui="enabled: false"
embedded
arjs="sourceType: webcam; videoTexture: true; debugUIEnabled: false;"
>
videoTexture: true;의 규격화 거리의 멱 함수.
😆같은 코드를 설정하고 사용하려고 시도합니다.
4. 대상이 확실히 표시되지만 아이폰의 경우 화면이 다운됩니다.
객체는 표시되지만 카메라가 작동할 때의 경치로 인해 동결됩니다.
이곳의 동결은 화면의 보기와 카메라를 어느 쪽으로 향하게 하는 최초의 화면이 변하지 않은 상태를 가리킨다.
이것은 마치 영상 화면에 AR 콘텐츠를 중첩하는 것과 같다.
로그를 보면 iOS14라면 동영상의 자동 재생은 사용자의 명확한 허가가 필요하기 때문에 권한에서 튀어나오면 화면이 최초의 경치에서 응고됩니까?추측
이렇게 되면 AR는 아무것도 없겠지.
막혔지?이거
그럼 어떡하지?
5. 사도이지만 모든 대상을 1km 이내로 표시하면 된다.
나는 이 방향으로만 할 수 있다고 결심했다.
다음에는 지정된 지점의 방향과 거리를 1km 이내로 다시 설정하고 싶습니다.
③의 자신의 위치에서 ①의 실제 위치와 방향을 구하여 표시할 수 있는 위치 ②로 재배치할 계획이다.
어쩌면 또 다른 좋은 해결 방법이 있을지도 모른다.
다음에는 위치를 다시 계산하고 조정된 계획을 쓰겠습니다.
계속
AR.js의 Location Based에서 모형의 이야기를 멀리서 강제로 표시합니다.
Reference
이 문제에 관하여(AR.js의 Location Based에서 모델을 멀리서 표시하려고 하면 곤란합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/ebifry_w_t/items/ef41efa584c14b7f71ba
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
<a-scene
vr-mode-ui="enabled: false"
embedded
arjs="sourceType: webcam; videoTexture: true; debugUIEnabled: false;"
>
객체는 표시되지만 카메라가 작동할 때의 경치로 인해 동결됩니다.
이곳의 동결은 화면의 보기와 카메라를 어느 쪽으로 향하게 하는 최초의 화면이 변하지 않은 상태를 가리킨다.
이것은 마치 영상 화면에 AR 콘텐츠를 중첩하는 것과 같다.
로그를 보면 iOS14라면 동영상의 자동 재생은 사용자의 명확한 허가가 필요하기 때문에 권한에서 튀어나오면 화면이 최초의 경치에서 응고됩니까?추측
이렇게 되면 AR는 아무것도 없겠지.
막혔지?이거
그럼 어떡하지?
5. 사도이지만 모든 대상을 1km 이내로 표시하면 된다.
나는 이 방향으로만 할 수 있다고 결심했다.
다음에는 지정된 지점의 방향과 거리를 1km 이내로 다시 설정하고 싶습니다.
③의 자신의 위치에서 ①의 실제 위치와 방향을 구하여 표시할 수 있는 위치 ②로 재배치할 계획이다.
어쩌면 또 다른 좋은 해결 방법이 있을지도 모른다.
다음에는 위치를 다시 계산하고 조정된 계획을 쓰겠습니다.
계속
AR.js의 Location Based에서 모형의 이야기를 멀리서 강제로 표시합니다.
Reference
이 문제에 관하여(AR.js의 Location Based에서 모델을 멀리서 표시하려고 하면 곤란합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/ebifry_w_t/items/ef41efa584c14b7f71ba
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
Reference
이 문제에 관하여(AR.js의 Location Based에서 모델을 멀리서 표시하려고 하면 곤란합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/ebifry_w_t/items/ef41efa584c14b7f71ba텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
