panolens
-
panolens, threejs 버전 업데이트 삽질 기록개발/개발관련 2024. 7. 22. 14:18
1. panolens, threejs 버전 업데이트지금 사용하고 있는 버전이 1년 이상된 버전이라 panolens 최신버전과 그에 맞는 threejs 105버전으로 업데이트 할 계획이다. threejs는 현재(20년 12월) 123 버전까지 나왔지만 panolens는 105버전으로 되어있다. 언젠가는 panolens를 버려야할때가 올 것 같다. 버그수정이나 업데이트가 하나도 안되고있다..일단 업데이트 해보고 vr button 기능을 추가해보고 안되면 aframe이나 순수 threejs를 사용해야 할 수도 있다...ㅜ 일단 현재 프로젝트에서 생성한 javascript 파일을 es6 버전으로 구조를 바꾸고, html 파일도 그에 맞게 수정한다.구조 자체를 바꿔야하고 모든 것을 새로 해야하기 때문에 삽질좀 했..
-
Threejs Texture marked for update but image is incomplete 경고개발/개발관련 2020. 8. 25. 12:00
Threejs에서 Texture marked for update but image is incomplete 이런경고가 크롬 콘솔창에 나왔다. Panolensjs에서 Threejs를 사용하기때문에 이런 경고가 뜨는것같고 Panolensjs의 infospot 관련된 부분의 경고이다. 이미지를 못가져오는 건가? -> 그런경우 못찾았다는 에러가 났을것이다 이건 아닌듯. 뭔가 텍스처 이미지 로드되는 그 근처에서 경고가 난것같은데.. 구글링해보니 로드되기전에 이미지를 사용해서 그런거라고 나오는데 똑같은 화면, 똑같은 소스를 쓰는 다른화면은 안그런데 얘만그렇거보면 이 화면에서 뭔가 잘못된거같은데... 일단 이미지 용량이 커서 그런건가해서 용량 작은걸로 바꿨는데도 같음 이미지 크기를 크게 나오게 해서 그런건가해서 줄여..
-
equirectangular panorama -> cube convert개발/코딩관련 2020. 3. 31. 16:01
0. krpano VS panolens왜 일반 사용자들은 krpano를 돈을주 고라도 많이 사용할까. 오픈소스인 panolens가 있는데. 파노라마 업체에서 선호하는 이유가 무엇을까. 편해서? 회사에 속한 개발자 입장에서 유료와 무료의 차이는 크다. 오픈소스로 유료모델과 같은 성능을 내는 것을 목표로하기 때문에. 그럼 차이를 알아보자. 개발이 쉽고 이런걸 떠나서 표면적으로 사용자가 느끼는 가장 큰 차이는 해상도와 속도의 차이인것같다. 먼저 해상도부터 보자1. 해상도회사에 insta360 카메라로 촬영해서 panolens를 통해 올린 360 이미지가 있는데 6080임에도 불구하고 360이미지라 해상도가 많이 떨어진다. 하지만 krpano를 쓴 사이트를 보면 해상도가 월등히 좋다. 까보니 큐브형태의 이미지로..
-
동영상 해상도 변경해도 이어서 보기개발/개발관련 2020. 2. 10. 17:34
동영상 해상도 변경시 해상도에 따른 동영상파일이 물리적으로 따로있기때문에, setPanorama 할 때 처음부터 재생이 된다. 이때 전 해상도의 시간을 저장해서 현 해상도의 영상이 재생될 때, 저장된 시간부터 재생이 될 수 있도록 해야한다. 1. 시행착오 panolensJS를 직접 수정하지 않고, 내가 만든 js를 통해서 컨트롤 하려했다. 하지만 setPanorama 하고 전후로 currentTime을 줘도 제대로 작동이 안되었다. 그렇다고 setTimeout을 주자니 정확한 문제해결이 아니라 다시 원복. setPanorama하고 모든 로직이 끝난 후 텍스처를 업데이트하기때문에 currentTime이 안먹는것 같았다. panolensJS 자체에서 setPanorama 부분을 수정해야할 것 같다. 2. s..
-
panolens 360 영상 재생 및 멈춤개발/개발관련 2020. 1. 9. 16:24
하나의 360 동영상인데, 일정시간 재생되고 내가 설정한 지점에서 멈추고, 이때 poi가 화면에 나온다. poi 클릭 시 내가 원하는 부분으로 영상이 이동되어 재생되어야한다. (앞으로든 뒤로든) 1. 시행착오 끝 소스 웹에서 360동영상이 재생이 되고 내가 설정한 시간에 동영상이 멈춰야한다. 여러 시행착오 끝에 정리한 소스이다. (참고만 할 수 있게 정리) videoTime1 : function() { this.video1_setTime = setTimeout("videoTime1()",1000); // 1초후에 자기자신을 호출 this.video1_time = (this.video1).videoElement.currentTime; if(this.f_플래그1 == 0 && this.video1_time ..
-
panolens threejs cache 미리 다운받기개발/개발관련 2019. 12. 23. 17:34
panolens를 이용해서 360이미지 여러개를 이었는데, 다음 이미지로 넘어갈때마다 사진 용량이 커서 오래 기다려하는 문제가 있었다. 미리 캐시에 올리게 되면 처음만 오래걸리지 캐시에 올라가고 나서부턴 속도가 개선될 것 같아서 방법을 찾아보기로했다. 1. 일단 구글링 해보자 서비스워커를 써야할 것 같다. 워커어쩌고는 옛날꺼고 문제도 많고 여러 브라우저에서 막히고 있다. 서비스워커는 구글디벨로퍼 사이트에서 어떻게 사용하는건지 나와있다. 해봤는데... panolens에선 이미지가 미리 다운이 안받아진다. 그래서 panolens를 열어봤더니 three.cache관련해서 소스가 뭔가 있다. 이부분을 좀 더 파야할 것 같다. 서비스워커는 panolens에서는 안될것같다. 2. threejs cache 일단 구글..